为什么内部函数中当前对象的方法未定义

Why method of current object in inner function is undefined?

本文关键字：方法 未定义 对象 内部函数 为什么      更新时间：2023-09-26

在外部函数中，this.foo是bar，这就是我所期望的。然而，在内部函数中，this.foo是未定义的，这是非常令人惊讶的。谁能帮我解决这个问题？谢谢。

var myObject = {
    foo: "bar",
    func: function () {
        console.log("outer func:  this.foo = " + this.foo);
        (function () {
            console.log("inner func:  this.foo = " + this.foo);
        }());
    }
};
myObject.func();

在外部函数中，这指的是myObject，因此可以正确地引用和访问foo。

但是，在内部函数（闭包）中，这不再指myObject。因此，this.foo 在内部函数中是未定义的（在 ECMA 5 之前，内部函数中的 this 将引用全局窗口对象;而从 ECMA 5 开始，内部函数中的 this 将是未定义的。 为了解决这个问题，我们可以在引用它之前将其存储在像 self 这样的局部变量中。

var myObject = {
    foo: "bar",
    func: function () {
        var self = this;
        console.log("outer func:  self.foo = " + self.foo);
        (function () {
            console.log("inner func:  self.foo = " + self.foo);
        }());
    }
};
myObject.func();

第一个实现是：

var myObject = {
    foo: "bar",
    func: function () {
        console.log("outer func:  this.foo = " + this.foo);
        (function (self) {
            console.log("inner func:  self.foo = " + self.foo);
        }(this));
    }
};
myObject.func();

第二个实现是：

var myObject = {
    foo: "bar",
    func: function () {
        console.log("outer func: this.foo = " + this.foo);
        (function () {
            console.log("inner func:  this.foo = " + this.foo);
        }.bind(this));
    }
};
myObject.func();
相关文章：