bind绑定参数

const curry = (fn) => (...args)=>fn.bind(null,...args);

const  split = curry((splitOn, str) =>str.split(splitOn));

console.log(split(" ")("Hello JS")); // ["Hello","JS"]

这个函数初看一头雾水，split()()被连续调用，但是两个参数是怎么传递的，fn.bind(null,...args)不仅绑定了this，还能传递参数？，查了一下MDN

bind()方法会创建一个新函数。当这个新函数被调用时，bind()的第一个参数将作为它运行时的 this, 之后的一序列参数将会在传递的实参前传入作为它的参数。

前半句好理解，相信大家也也用到过，为函数绑定运行时的this

var name = "out value"
const obj = {
    name:"test bind",
    fn:function(){
        console.log(this.name);
    }
};

let f1 = obj.fn.bind(obj);
let f2 = obj.fn

f1()  // test bind
f2()  // out value

后半句，多余的参数将会当成新函数被调用时的参数，看例子

function test(one,two){
    console.log(one);
    console.log(two);

    console.log(arguments);
}

var tmp = test.bind(null,111);

tmp(2222);  // 111 222 {0:111,2:222}

111被当成了函数的第一个参数

回头看，这个函数写的很简洁 ，平时实现相同的方法，大概会这么写

function curry(fn){
    return function(splitOn){
        return function(str){
            return fn(splitOn,str);
        }
    }
}

ES6 写法

const curry = (fn) => (...agrs) => (str) => fn(...agrs,str)
const  split = curry((splitOn, str) =>str.split(splitOn));
console.log(split(" ")("Hello JS"))

总的来看区别不大，只是代码看起来更干净一点

转载于:https://www.cnblogs.com/asuishi/p/6235625.html