1

我正在使用 traceur 测试 ES6 中的类，但它没有按我预期的那样工作。

我正在尝试使用一个方法作为另一个类中的引用，但是当它被调用时，我在读取this.

这是我的代码：

class A {
    constructor(anotherMethod){
        this.anotherMethod = anotherMethod;
        this.name = "A";
    }
    myMethod (){
        console.log(this.name);
        this.anotherMethod();
    }
}

class B {
    constructor(){
        this.a = new A(this.myMethod);
        this.name = "B";
    }
    myMethod(){
        console.log(this.name);
    }
}

var c = new B();
c.a.myMethod();

我的预期日志是：

A
B

但它显示：

A
A
4

1 回答 1

2

在 B 类中，当构造函数运行时：

this.a = new A(this.myMethod);

您实际上是在myMethod将 B 的方法设置为 A。当 A 的构造函数运行时，

this.myMethod，设置为 A 的另一个方法。现在，如果您尝试this.a在 B 的构造函数中打印，您将得到name : A. 这实际上是在引用 A 类。

现在，当您尝试执行该方法时c.a.myMethod()，由于 A 包含对 的引用class A，它正在调用myMethodA。在此方法中，将引用当前执行上下文对象，即 A。这就是您在两个控制台中都this看到的原因A.

简而言之，您只是将功能分配给 A 而不是设置上下文。

您可以强制fat arrow使用以下内容：

class B {
    constructor(){
        this.a = new A(this.myMethod);
        this.name = "B";
    }

     myMethod = () => {
            console.log(this);
     }
}

现在您将获得所需的输出。但不幸traceur的是不支持它。只有 babel 支持fat arrow内部函数，它是ES7 stage 0 Class Properties.

正如 Felix King 所建议的那样：bind目前使用绑定上下文已经绰绰有余

class B {
    constructor(){
        this.a = new A(this.myMethod.bind(this));
        this.name = "B";
    }

     myMethod() {
            console.log(this);
     }
}
于 2015-04-03T04:57:36.893 回答