未绑定并在表达式/括号中返回时的 JavaScript 对象函数和 `this`

IT技术 javascript this
2021-02-24 14:48:49

第 1-2 和 4-5 行在this返回值方面有意义我错过了第 3 行什么?我认为它会返回window类似于第 4-5 行。这 5 个中是否有另一种模式可以帮助说明原因?

foo = { bar : function () { return this } }

foo.bar() // ==> foo

(foo.bar)() // ==> foo / but why?

(foo.bar ? foo.bar : $.noop)() // ==> window

(foo.bar || 0)() // ==> window
2个回答

分组运算符不会破坏引发方法调用的属性引用

规范中明确提到了这一点

注意:此算法不会将GetValue应用于评估结果Expression这样做的主要动机是,诸如delete和 之类的运算符typeof可以应用于带括号的表达式。

在第 4 行和第 5 行中,不是括号而是运算符 ( ?:and ||) 取消引用该属性并产生“未绑定”函数。

很好的答案,实际上有一些常见的技巧可以“解决”这个问题,我见过的最常见的技巧是(0,foo.bar)在不添加行的情况下破坏引用或引起间接调用。它也产生了一个有趣的例子eval:)
2021-04-23 14:48:49

foo.bar 这是一个匿名函数。

如果你把它分成不同的行可能更有意义:

foo = {
    bar: function() {
        return this;
    }
}

因此,当您调用 时foo.bar,您会得到function() { return this; }在第二行,您直接调用该函数 ( foo.bar()),因此它返回this对象 ( foo)的实例

在第三行,您得到相同的结果,因为您不仅要求匿名函数,而且还执行该函数:

(foo.bar); // (function() { return this; }); A reference to the function
(foo.bar)(); // (function() { return this; })(); Actually calling the function

因为在后一种情况下,您像在第二行中那样执行函数,结果是相同的 ( foo)。

然而,在第 4 行和第 5 行,正如 Bergi 所说,您使用的运算符从函数中取消引用它们,这给您留下了一个Window对象而不是foo