javascript - 与 JavaScript 匿名函数中的 "this"对象混淆

Question

您好，我尝试运行以下 JavaScript 代码。我的目标是掌握 this 的含义在 JavaScript 中的不同范围和不同类型的调用中。

如果您查看下面的代码:我有一个内部匿名函数，它被分配给 innerStuff多变的。在那个匿名函数中 this指向 window对象而不是外部函数对象或其他任何东西。尽管事件仍然可以访问函数的变量。

无论如何，我不确定为什么会这样；但是如果你看下面的代码，我会通过 this形式为 that至 innerStuff后来它工作得很好并用 doofus 打印对象控制台中的属性。

    var someStuff = {
        doofus:"whatever",
        newF: function()
        {
            var that = this;
            console.log(that);
            var innerStuff = function(topThis){
                console.log(topThis);
            };

            return innerStuff(that);
        }
    }

    someStuff.newF();

现在我只是稍微更改了一个代码。而不是将其分配给 innerStuff ，我将直接通过调用它返回函数，如下所示:

    var someStuff = {
        doofus:"whatever",
        newF: function()
        {
            var that = this;
            console.log(that);
            return function(that){
                console.log(that);
            }();
        }
    }

    someStuff.newF();

这会为内部匿名函数打印 undefined。是因为 that 之间有冲突吗？正在作为参数和 that 传递在外部函数中定义？我认为该参数会覆盖可见性。为什么不保留值(value)？

这完全令人困惑。

另一方面，如果我没有通过 that ，而只是使用它，因为可见性在那里，结果是正确的并且符合预期。

我错过了什么？是否存在于同一范围内的变量之间的冲突？有没有充分的理由，内部函数有 this绑定(bind)到 window对象？

Answer 1

JavaScript 中的

this 指的是您调用方法的对象。如果您将函数调用为 someObject.functionName(args)，则 this 将绑定(bind)到该对象。如果您只是调用一个裸函数，如 functionName(args)，那么 this 将绑定(bind)到 window 对象。

在第二个示例中的 newF 内部，您在内部函数中隐藏了 that 变量，但没有向其中传递任何内容，因此它是未定义的。

        var that = this;
        console.log(that);
        return function(that){
            console.log(that);
        }();

如果您想要与您的第一个示例等效的东西(将 that 传递给内部函数)，您可能需要以下内容:

        var that = this;
        console.log(that);
        return function(that){
            console.log(that);
        }(that);

或者下面的，如果你不想隐藏它而只是使用外部函数的绑定(bind):

        var that = this;
        console.log(that);
        return function(){
            console.log(that);
        }();