javascript - 难以理解方法借用

Question

我在理解这段代码或 Method Borrowing 时遇到问题 ->

   function func() {
      [].join.call(arguments)   //how does this works?
   {

join 只需要一个分隔符，为什么我们要传递 this 上下文值？更有趣的是它有效!

有人给我解释一下吗？

:)

Answer 1

.call()方法用于函数，它的行为类似于使用 () 调用函数，例如当您执行 functionName() 时，但是，它允许您显式地定义函数内部的 this 是什么，例如:

function functionName(arg) {
  console.log("this", this); // this {"foo": 1}
  console.log("arg", arg); // arg str
}

functionName.call({foo: 1}, "str");

请注意，.call() 的第一个参数定义了函数内部的 this，然后第二个参数定义了参数是什么函数名。

我们可以在任何函数上使用 .call()，包括 JavaScript 提供给我们的函数。在您的代码中，您正在使用 [].join 公开(而不是调用)数组的 join 函数，也就是说，它使您可以访问 在 Array.prototype 对象上定义的 join 函数。考虑到这一点，您的代码可以像这样重写以突出显示 [].join 仅用于从数组原型(prototype)中获取 join 函数:

function func() {
  const joinFn = Array.prototype.join; // or: [].join;
  console.log(joinFn.call(arguments));
}
func('a', 'b', 'c'); // "a,b,c"

在内部，数组上的 .join() 方法在其中使用了 this(类似于 functionName() 使用 的方式) this inside) 以确定哪个对象/数组需要将其元素“连接”在一起。在您的示例中，您没有直接在空数组上调用 .join(即:[].join())，而是使用空数组来访问.join 函数，然后用 arguments object 调用它通过使用 join.call(arguments)。当您执行此操作时，.join() 方法中的 this 被设置为 arguments 对象并且调用 join 方法时没有参数，因此分隔符默认为 ,。因为 arguments 对象是 array-like (它像数组一样具有索引和 length 属性)，它的元素可以连接在一起，就像数组的元素可以连接在一起一样。

可以看到section 23.1.3.15 ECMAScript 规范的详细信息，了解有关 Array.prototype.join 如何在内部工作以及如何使其通用以处理类数组对象而不仅仅是数组的更多详细信息。