javascript - `bind.bind` 是什么意思？一种使用 JavaScript bind 的奇怪方式

Question

我正在阅读一本关于编写 JavaScript 框架的书，并找到了这段代码。但是我不明白它是如何工作的，尤其是 bind.bind 的用法？有人知道吗？

var bind = Function.prototype.bind;
var apply = bind.bind(bind.apply);
var fn = apply([].concat);
var a = [1, 2, 3], b = [4, [5, 6], 7];
fn(a, b);
//output [1, 2, 3, 4, 5, 6, 7]

Answer 1

这让我回到了求解和扩展方程式的日子。

1。首先，让我们展开第一个应用函数:

var bind = Function.prototype.bind;
var apply = bind.bind(bind.apply);
var fn = apply([].concat);

转换为:

var apply = Function.prototype.bind.bind(Function.prototype.bind.apply);
var fn = apply([].concat)

---

2。其次，我们扩展fn函数:

var fn = Function.prototype.bind.bind(Function.prototype.bind.apply)([].concat);

---

3 。我们现在发明一个 js 代数规则并替换 bind.bind...()调用调用调用。

实际上，我们基于以下概念实现替换:

someFunction.bind(arg1)(arg2) <==> someFunction.call(arg1, arg2)

因此我们可以替换它并得到:

var fn = Function.prototype.bind.call(Function.prototype.bind.apply, [].concat);

---

4 。对于我们的第二个 js 代数规则，我们设计了:

someFn.bind.call(target, ...) <==> target.bind(...) .

someFn在这里并不重要，因为我们不对其调用 bind()。我们调用 call在 bind 上- 替换 this那是someFn因此它被替换为 target .

因此我们替换了bind.call(target)使用 target.bind 替代方案

var fn = Function.prototype.bind.apply.bind([].concat) 

---

5 。如果最后一个排列也在执行调用 ()，我们可以像这样进行替换:

fn([1, 2], [3, 4]) <==> [].concat.apply([1, 2], [3, 4])

但是我们只有绑定(bind)而没有我们可以替换的调用，相当于:

var fn = function (arg1, arg2) { 
    return [].concat.apply(arg1, arg2); 
}
// instead arg1 and arg2 we could use more accurate arguments logic also.

---

最终结果

var fn = Function.prototype.bind.apply.bind([].concat) 

// or

var fn = function (arg1, arg2) { 
    return [].concat.apply(arg1, arg2); 
}

fn函数采用 concat函数并让我们以函数式风格使用它，而无需从对象调用它。而不是 concat绑定(bind)到 this来电者，fn将其应用于 arg1作为this和 arg2作为连接到 arg1 的其他参数.

fn([1, 2], [3, [5, 6], 4])
// [1, 2, 3, 5, 6, 4]