javascript - JavaScript 中绑定(bind)和调用的混淆

Question

当我在MDN中阅读Array.prototype.slice时，我发现了一个例子:Array-like objects:

这里是示例代码:

var unboundSlice = Array.prototype.slice;
var boundSlice = Function.prototype.call.bind(unboundSlice);

function list() {
  return boundSlice(arguments, 0);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

调用list(1, 2, 3)时，函数调用流程是怎样的？

1. 我知道在 list() 中，它调用 boundSlice([1, 2, 3], 0)。但是 boundSlice 中发生了什么？
2. 据我了解，boundSlice 是 Function.prototype 的 call() 函数的绑定(bind)函数，其中 this 值设置为 Array.prototype 的 slice() 函数。
3. slice()就是this，那么如何产生结果[1, 2, 3]呢？我猜最后的调用是 [1, 2, 3].slice(0)，对吗？如果我是对的，怎么会发生这种情况，有人可以向我解释一下内部过程吗？

Answer 1

var boundSlice = Function.prototype.call.bind(unboundSlice);

这基本上是:

var boundSlice = function (thisArg, arg1) {
    unboundSlice.call(thisArg, arg1);
};

棘手的部分是它如何知道对 unboundSlice 执行 call 操作？这是因为 call 方法在内部使用 this 值来了解要调用哪个函数，并且我们将 this 值设置为 unboundSlice 通过使用 ...call.bind(unboundSlice) 调用此方法。

例如，当我们执行 Array.prototype.slice.call(arguments, 0) 时，call 中的 this 值将是Array.prototype.slice 因为 this 值在未更改时始终是 . 的左侧。

您关于 list(1, 2, 3) 的结果是 [1, 2, 3].slice(0) 的假设是正确的。

请注意，list 可以简单地实现为:

function list() {
    return Array.prototype.slice.call(arguments);
    //or return [].slice.call(arguments);
}