javascript - 为什么我们无法访问内部函数内的 'this'？

Question

这个问题已经有答案了:

IIFE invocation in JavaScript (1 个回答)

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

已关闭 8 年前。

在下面的代码中，有两个函数，外部函数和内部 IIFE 函数。

以下代码的输出是:

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

我不明白为什么在内部 IIFE 函数中，this self 时不能用于访问 foo 变量还可以。我明白var self是内部函数的全局变量，仍然可以访问。但是this呢？ ？

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();

Answer 1

在内部函数中，this可以被引用，但它的值与外部函数不同。每个函数调用都涉及为被调用函数内的特定调用设置 this。请注意，每个函数调用都决定了this；这与函数的固有性质无关，而与函数的调用方式有关。

在这种情况下，调用匿名内部函数时没有任何显式的 this 值，因此它的值将是对全局对象(浏览器中的window)的引用)。在“严格”模式下，该值将为未定义。

您可以强制this成为self:

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

通过使用 .call()，匿名函数内 this 的显式值可确保它将引用同一对象。