javascript柯里化

什么是柯里化

如果一个函数可以接收多个参数，将这个函数转化为每次只接收一部分参数的函数的多次调用形式，就是柯里化。文字上理解比较困难，先来看看下面的代码：

function add(a, b, c) {
    return a + b + c;
}

这个add函数接收3个参数，返回3个参数相加的结果。可以通过以下2种形式对其进行柯里化：

function addOne(a) {
    return function(b) {
        return function(c) {
            return a + b + c;
            }
        }
    }
}

function addTwo(a,b) {
    return function(c) {
        return a + b + c;
    }
}

add(1, 2, 3);        // return 6
addOne(1)(2)(3);     // return 6
addTwo(1, 2)(3);     // return 6

使用场景

-性能优化(可以预定义一些模版数据)

function addCrossBrowserEvent() {
    if (window.addEventListener) {
        return function(el, sType, fn, capture) {
            el.addEventListener(sType, function(e) {
                fn.call(el, e);
            }, (capture));
        };
    } else if (window.attachEvent) {
        return function(el, sType, fn, capture) {
            el.attachEvent("on" + sType, function(e) {
                fn.call(el, e);
            });
        };
    }
}

var addEvent = addCrossBrowserEvent();

addEvent(element, "click", handleClick, true);

• 便于理解
  react-redux的connect方法，就是使用了柯里化增加代码的可读性:

let Container = connect(mapStateToProps, mapDispatchToProps)(Component);

在这里，connect的作用就是将Component要用到的state切面和action注入到它的property中，达到展示型组件和容器组件分离的目的。如果将这个方法的定义改为:

let Container = connect(mapStateToProps, mapDispatchToProps, Component);

就没那么好理解了。而且，mapStateToProps和mapDispatchToProps实际上也是可选参数，在不传它们的情况下传入Component会显得很恶心: connect(null, null, Component)。