了解涉及`arguments`的`this`行为[重复]答案

【问题标题】：Understanding `this` behaviour where `arguments` are involved [duplicate]了解涉及`arguments`的`this`行为[重复]
【发布时间】：2018-10-31 07:47:30
【问题描述】：

所以，我有以下 3 个功能：

function a() {
  arguments[0]();
}

function b(fn) {
  fn();
}

function c() {
  console.log(this);
}

现在，考虑输出：

a(c) // Arguments
b(c) // Window
a(() => {console.log(this}) // Window
b(() => {console.log(this)}) // Window

为什么a(c) 在所有其他情况下都是窗口（考虑非严格）时输出参数？

【问题讨论】：

这里唯一看似奇怪的情况是第一个。与foo.bar()，foo 将是这个。这等价于foo["bar"]()，因此也等价于arguments[0]()。
因为arguments[0]();是一个方法调用。
谢谢@Bergi。我花了一段时间才明白这一点

标签： javascript arguments this

【解决方案1】：

在 JavaScript 中，this 通常指调用函数的对象（除非它是箭头函数）。例如，如果我们这样做：

var obj = { fun: function() { console.log(this); } }
var obj1 = { fun: obj.fun, otherProperty: 123 }
obj.fun(); // equivalent to obj["fun"]()
obj1.fun(); // equivalent to obj1["fun"]()

我们会发现在第一次调用中this 指的是obj，而在第二次调用中它指的是obj1，即使它是同一个函数。

现在，arguments 变量是一个对象，它存储传递给函数的所有参数。如果一个参数是一个函数，并且您通过arguments 对象访问它，它就会成为调用该函数的“父”对象，并在函数的执行上下文中成为新的this。你可以认为你的情况是这样的：

function c() {
  console.log(this);
}
var arguments = { "0" : c }
arguments["0"]() // will log the arguments object

在您的第二次调用 (b(c)) 中，作为参数传递的函数直接在父函数内部调用，而不通过代理对象访问它 - 在这种情况下，this 将从父执行范围复制，这是window。

在第三个和第四个示例中，两个函数都是使用箭头函数定义的，这会将 this 的值从创建它们的上下文中保存下来，并防止该值被更改。

更多关于箭头函数：Arrow functions

【讨论】：