Aurelia transpiler："this“为"null”

Question

我的Aurelia应用程序中有以下代码：

import {digit} from "../util/random" // generates a random digit [0,9]

export class UnitedStates {

  zipCode() {
    return ""+digit(5);
  };

  zipPlus4() {
    return this.zipCode()+"-"+digit(4);
  };

  ...

}

获取zipPlus4正文的错误TypeError: Cannot read property 'zipCode' of null。在开发人员工具中的检查显示，this是null。

为什么是this null，我该如何解决这个问题？

Answer 1

这是转译器的一个问题。回想一下，箭头函数表示法维护词法this (或者更多的read here )。因此，当Babel和其他转译器进入新的作用域时，它们维护一个本地this变量，以便可以从任何子作用域访问它。通常，此变量为_this。

有时，像DevTools这样的调试器很难理解源地图，并且它们会报告一个空this。事实证明，这只在检查代码时才会发生；当运行代码时，它会正常工作。

那么，当报告this为空时，如何检查它的值呢？通常从控制台检查_this。这将为您提供正在使用的真实this值。