javascript - 为什么匿名函数会失去对象作用域？

Question

匿名函数/闭包是否应该保留其创建对象的范围？

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

这种方式产生相同的结果。

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

//输出

outer func:  this.foo = bar
outer func:  self.foo = bar
inner func:  this.foo = undefined
inner func:  self.foo = bar

Answer 1

这只是 JavaScript(特别是 ECMAScript5)的一个核心概念。匿名函数，尤其是在闭包中，不保留上下文。

你可以这样做:

(function() {
    console.log("inner func:  this.foo = " + this.foo);
    console.log("inner func:  self.foo = " + self.foo);
}).call(this);

那是因为您实际上是在调用该函数。如果您要传递回调，则可以使用 Function.prototype.bind相反。

如果您使用的是 ECMAScript6，则可以使用箭头函数来保留匿名回调的上下文:

(() => {
  // `this` retains the context of its parent context
});