JavaScript中arguments[0]()调用行为的原因及相关资源咨询

这事儿本质是JavaScript里函数调用时的this绑定规则在搞鬼，咱们来一步步捋清楚：

1. 先还原你的代码场景 #

我猜你的代码大概是这样的（完全匹配你描述的现象）：

function fn() {
  // 你大概率在这里用了this相关的属性，比如this.length
  return this.length;
}

function outer() {
  // 第一次调用：直接调用fn，你原本以为this是预期的上下文
  console.log(fn(10)); // 你预期输出10，实际可能输出0（浏览器全局对象的length是0，Node环境是undefined）
  // 第二次调用：通过arguments[0]()调用fn
  console.log(arguments[0]()); // 实际输出2——也就是outer函数接收的参数个数
}

outer(fn, 10);

2. 核心原因：隐式绑定的规则 #

当你通过对象属性访问的方式调用函数时（比如obj.method()），函数里的this会自动绑定到这个对象上。这里的arguments是个类数组对象，arguments[0]就是你传给outer的fn函数，所以arguments[0]()完全等价于：

fn.call(arguments);

说白了就是把fn的this强行绑定到了outer的arguments对象上。

所以当fn内部访问this.length时，拿到的自然是outer的arguments的长度——也就是2，毕竟你给outer传了俩参数：fn和10。

3. 为什么你原本以为是10？ #

你应该是混淆了函数参数和this绑定这俩事儿：

• 要是你希望fn返回10，那得在调用的时候传参数：arguments[0](10)，同时fn内部要返回这个参数：

  function fn(num) {
    return num;
  }
  // 这时候arguments[0](10)就会输出10，和你预期一致
  

• 但如果你调用时没传参数，还在fn里用了this，那this就会绑定到调用它的那个对象（也就是arguments）上，自然拿到的是arguments的属性值。

4. 额外补充：严格模式的差异 #

要是你的代码跑在严格模式下，arguments[0]()里的this会变成undefined，这时候访问this.length直接就报错了——因为严格模式禁用了默认的全局绑定行为。

内容的提问来源于stack exchange，提问作者Pankaj Shukla