js中 Function.prototype.call.bind(Array.prototype.slice)， 这个怎么理解？

Question

MDN中

在下面这段代码里面，slice 是 Function.prototype 的 apply() 方法的绑定函数，并且将 Array.prototype 的 slice() 方法作为 this 的值。这意味着我们压根儿用不着上面那个 apply()调用了。 这段话没有看明白。

// 与前一段代码的 "slice" 效果相同
var unboundSlice = Array.prototype.slice;
var slice = Function.prototype.apply.bind(unboundSlice);

// ...

slice(arguments);

Answer 1

这个表达式是一个经典的 JavaScript 技巧，它用于将一个函数绑定到一个特定的上下文，并且固定部分参数，从而创建一个新的函数。

具体来说，这个表达式的含义如下：

• Function.prototype.call：Function.prototype 是所有函数的原型对象，call 是 Function.prototype 上的一个方法，它可以用来在指定的上下文中调用函数，并且可以将函数的参数以单独的参数传递。
• bind(Array.prototype.slice)：bind 是 Function.prototype 上的另一个方法，它可以将函数绑定到一个特定的上下文，并且固定函数的一部分参数。在这个表达式中，bind 方法将 Array.prototype.slice 函数绑定到 Function.prototype.call 函数上，从而创建一个新的函数。
• Array.prototype.slice：Array.prototype 是数组的原型对象，slice 是 Array.prototype 上的一个方法，它可以用来从数组中提取一个子数组。

因此，这个表达式的含义是：创建一个函数，该函数将参数列表中的第一个参数作为上下文，在该上下文中调用 Array.prototype.slice 函数，并且固定第二个参数（开始提取的位置）以及第三个参数（结束提取的位置），从而创建一个新的函数，该函数可以用来从数组中提取一个子数组。

例如，以下代码使用这个技巧来创建一个函数，该函数可以从一个数组中提取一个子数组，并且将子数组中的元素乘以 2：

var doubleSlice = Function.prototype.call.bind(Array.prototype.slice, null, 0).bind(null, 2).bind(null, 4);
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var result = doubleSlice(arr).map(function(n) {
    return n * 2;
});
console.log(result); // [8, 10, 12]

在上面的代码中，doubleSlice 函数可以从数组中提取一个子数组，该子数组从索引 2 开始，到索引 4 结束，然后将子数组中的元素乘以 2 并返回一个新的数组。

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。