如何“this"在Javascript的回调中查找

How "this" is looked up in callback of Javascript

本文关键字：Javascript 回调 查找 this quot 如何      更新时间：2023-09-26

我对以下情况感到困惑:

function foo() {
}
foo.prototype.bar1 = function() {
  console.log(this); // shows "Window"!!
}
foo.prototype.bar2 = function(func) {
  func();
}
var f = new foo();
f.bar2(f.bar1);

console.log(this)的结果如何/为什么是"Window"?我认为无论你在这里如何调用类的公共函数，"this"应该总是指"foo"。

还有什么正确的方法来避免这种错误?

谢谢

当你做f.bar2(f.bar1)时，你将bar1的引用传递给bar2;在bar2中，它只被称为"func"，与f的连接丢失了。this的值是在调用函数时动态确定的。如果您调用f.bar1()，这将是f，但当您调用func()时，它是未定义的，并且将回落到全局对象(窗口)。

我之前已经解释过如下:

基本规则是:this将是全局对象，除非:
  • 函数被作为对象方法调用(那么这将是对象)，或
  • 函数作为构造函数调用，带有new操作符(在这种情况下，this将指向正在使用的新对象)构造)
避免这种情况的一种方法是创建一个绑定函数并传递它: 
f.bar2(f.bar1.bind(f));

请注意，Function.prototype.bind不支持旧的浏览器，所以你可能需要一个polyfill(在MDN上有一个可用)。

在您展示的简单场景中，您可以按照elclars在他的评论中建议的那样做，因为目标在bar2:

中可用。
func.call(this);
相关文章：