Question

我正在使用Babel转换ES2015课程：

class Foo {
    constructor(foo) {
        this.foo = foo;
    }

    sayFoo() {
        console.log(this.foo);
    }
}

如果我说fooVar.sayFoo()之类的内容，这个课程就像我期望的那样。但是，如果我尝试将方法视为典型的JavaScript函数并将其作为参数（element.click(fooVar.sayFoo)）传递，那么当方法实际运行时，它的词法this是事件对象，而不是{的实例{1}}，因此Foo未定义。

相反，由于我指定了this.foo的实例，因此我希望Foo绑定到fooVar.sayFoo的值。我必须写一个额外的包装函数，以便按照我的预期工作。

我试图查看ES6规范，但无法弄清楚范围规则。根据规范，这种奇怪的范围行为是否正确，或者它是某个地方的错误（例如，在巴别塔中）？

Answer 1

这是正确的行为，即使它看起来很奇怪吗？

是。对于分配给prototype属性的函数，方法或多或少具有语法糖。

只有箭头功能会以不同的方式处理this。

但是，不是编写包装函数，而是可以将实例显式绑定到方法：

element.click(fooVar.sayFoo.bind(fooVar));

另见How to access the correct `this` / context inside a callback?

为什么没有方法参考跟踪这个？

1 个答案: