javascript - 做了一些 javascript 实验，需要你的帮助来理解意想不到的结果

Question

我在浏览器控制台中做了一个 JavaScript 实验 -

首先我创建了一个新对象 foo 如下

  var foo = {
    bar: function() { return this.baz; },
    baz: 1
  };

现在，当我在控制台中再次运行以下代码时，它会返回“number”

  (function(){
    return typeof foo.bar();
  })();

但是当我运行以下匿名函数时，它返回“未定义”

  (function(){
    return typeof arguments[0]();
  })(foo.bar);

据我所知，上面函数中的arguments[0]返回foo.bar(也由下面的示例证明)那么为什么上面的代码返回 “未定义”而不是“number”？

<小时/>

当我运行时

      (function(){
        return arguments[0];
      })(foo.bar);

返回function () { return this.baz; }

<小时/>

还有

  (function(){
    return typeof arguments[0];
  })(foo.bar());

返回“number”那为什么不呢

  (function(){
    return typeof arguments[0]();
  })(foo.bar);

返回相同吗？ JavaScript 中有什么基本法则在这里发挥作用吗？

Answer 1

this 取决于您调用该函数的方式。当使用点表示法时，JavaScript 将 this 的上下文设置为接收者。在您的情况下，没有接收者，而是对函数的引用，因此您丢失了上下文。您必须显式传递它:

arguments[0].call(foo);

arguments[0] 与 foo.bar 是相同的函数对象，但 this 的值是动态的。在 foo.bar() 中，this 被分配给 foo，因为您使用了 foo.(点表示法)。但在 arguments[0]() 中没有点(没有接收器)，因此 this 是默认值，或 window。

这是相同的函数但不同的调用。