我正在使用 Babel 转译一个 ES2015 类:
class Foo {
constructor(foo) {
this.foo = foo;
}
sayFoo() {
console.log(this.foo);
}
}
如果我说类似 fooVar.sayFoo()
的话,这个类的工作完全符合我的预期。但是,如果我尝试将该方法视为典型的 JavaScript 函数并将其作为参数传递 (element.click(fooVar.sayFoo)
),则当该方法实际运行其词法 this
是事件对象,不是 Foo
的实例,所以 this.foo
是未定义的。
相反,因为我指定了 Foo
的实例,所以我希望 fooVar.sayFoo
绑定(bind)到 fooVar
的值。我必须为此编写一个额外的包装函数才能按预期工作。
我试图查看 ES6 规范,但无法弄清楚范围规则。根据规范,这种奇怪的作用域行为是正确的,还是某个地方的错误(例如,在 Babel 中)?
最佳答案
Is this the correct behavior, even though it seems weird?
是的。方法或多或少是分配给 prototype
属性的函数的语法糖。
只有箭头函数对 this
的处理方式不同。
但是,您可以显式地将实例绑定(bind)到方法,而不是编写包装函数:
element.click(fooVar.sayFoo.bind(fooVar));
另见 How to access the correct `this` / context inside a callback?
关于javascript - 为什么方法引用不跟踪这个?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35050878/