javascript - 为什么传递 JavaScript 对象的方法不会更新该对象？

Question

这个问题已经有答案了:

How does the "this" keyword work, and when should it be used? (22 个回答)

已关闭 6 年前。

我注意到，当将对象的方法(更新对象自己的属性之一)作为参数传递给另一个函数时，原始对象将不会被修改。

例如:

var obj = {
    foo: 0,
    bar: function () {
        this.foo++;
    }
};

function baz(callback) {
    callback();
}

baz(obj.bar); // does not alter obj
obj.bar(); // increments obj.foo successfully
console.log(obj.foo); // should be 2, not 1

既然 JavaScript 对象是通过引用传递的，为什么会这样？

Answer 1

这是因为函数的上下文 - 或 this 值 - 基于它的调用方式，而不是定义。您的 bar 函数不知道它位于 obj 对象内部。

当您执行 obj.bar(); 时，您是在 obj 的上下文中调用它，因此 this 就是你所期望的。

当您执行baz(obj.bar);时，您将bar函数作为参数传递。它不再与 obj 对象有任何联系。请记住，函数可以像变量一样对待。因此，当 baz 运行其回调时，它是在“全局”上下文中运行的(this 是 window)。

这里的解决方案是使用.bind()来“锁定”this值。

baz(obj.bar.bind(obj));