Js函数柯里化

柯里化函数用来干嘛？

用来固定某个函数的一些参数，得到该函数剩余参数的一个新函数，如果没有剩余参数，则调用自己。
柯里化是函数式编程里面的东西
简单来说就是用来固定参数的。

一开始我认为，函数参数的存在就是为了解决变量的不确定性，所以我认为，参数就是可变的，而不是固定的，既然要固定，直接在函数内部定义变量就好啦，何必要参数？
后来发现，很多场景都没有想象的简单。

比如说我只要用一个函数创建DOM元素，条件如下：
1、创建多个 3*3 正方形，只有背景颜色不同。
2、创建多个 4*5 矩形，只有背景颜色不同
正常来说是不是封装一个函数，传入宽高还有背景颜色就行了是不是？
但是，我很懒，既然第1种情况只有背景颜色不同，我想只传入背景颜色就好了，宽高给我固定下来。
到了第2中情况，你宽高和第一种情况不同，但是也是固定的，我也想只传入背景颜色就好了。
所以，类似这样的场景，函数柯里化就出现了。

再举个比较极端的栗子：

/**
 * 将5个数求和
 */
function sum(a, b, c, d, e) {
    return a + b + c + d + e;
}
console.log(sum(1, 2, 3, 4, 5));

正常操作就这样直接传递5个参数就行了对吧。

但是有些情况就是，我要多次求和，并且前2个参数固定为1和2，
所以会出现以下的情况

console.log(sum(1, 2, 5, 6, 0));
console.log(sum(1, 2, 5, 1, 1));
console.log(sum(1, 2, 5, 0, 0));

这时候，柯里化(curry) 的作用就来了

let newSum = curry(sum, 1, 2); //将前2个参数固定为1,2，再交给newSum去执行

从此以后，newSum只需要把剩下的参数补齐就行了。

console.log(newSum(3, 4, 5));

那么，curry如何封装呢？

function curry(func, ...args) {
    //func是目的函数(这里就是sum)，接着收集剩余的参数，但是可能还是没收集完
    //因为这个curry函数要交给一个新的函数去接着处理，所以这里返回一个高阶函数
    return function (...newArgs) {
        //将2次收集的参数放在一起。变成一个新数组，装着所有的参数
        let totalArgs = [...args, ...newArgs];
        if (totalArgs.length >= func.length) {
            //如果那个新的数组装的参数够了，
            //即和目的函数(这里是sum)的形参数目相同，
            //将新数组展开，传给目的函数并执行
            return func(...totalArgs);
        } else {
            return curry(func, ...totalArgs);
            //如果参数不够
            //继续固定，
            //将目的函数func作为实参第一项，将现所收集到的所有参数展开，再交给curry
            //curry继续收集
        }
    }
}

在ES6之前，没有展开运算符这么方便，可以借用函数的apply()传递

function oldCurry(func) {
    //借用一下数组的slice方法，将arugments中第0项切掉，只收集第一项之后的数
    //因为这里的第0项是形参func，也就是目的函数(这里是sum)
    var args = Array.prototype.slice.call(arguments, 1);
    //因为这个oldCurry函数要交给一个新的函数去接着处理，所以这里返回一个高阶函数
    return function () {
        //继续讲这个高阶函数里面的arguments收集
        //并且将这个auguments转化为真数组。
        var subArgs = Array.from(arguments);
        //将2次收集的参数放在一起。变成一个新数组，装着所有的参数
        var totalArgs = args.concat(subArgs);
        if (totalArgs.length >= func.length) {
            //如果那个新的数组装的参数够了，
            //即和目的函数(这里是sum)的形参数目相同，
            //借用一下函数的apply方法，就为了将totalArgs数组的参数展开传入到func
            return func.apply(null, totalArgs)
        } else {
            //如果参数不够
            //将目的函数func作为实参第一项，
            totalArgs.unshift(func);
            return curry.apply(null, totalArgs);
            //将现所收集到的所有参数展开，再交给curry
            //继续固定，
            //curry继续收集
        }
    }
}

总结来说：柯里化的作用就是把一个多参数的函数变成一个单个参数的函数。因为在函数式编程里面，单参数是非常重要的，它能实现很多丰富的效果

最后编辑于：2020.05.01 22:45:53