什么是柯里化
柯里化(Currying)是把接受多个参数的函数变换成接受一个单一参数的函数,并且返回接受余下的参数且返回结果的新函数的技术。
简单示例
1 |
|
2 | function add(x,y) {
|
3 | return x+y;
|
4 | }
|
5 | add(1,2);
|
6 |
|
7 |
|
8 |
|
9 | function addCurry(x) {
|
10 | return function (y) {
|
11 | return x+y;
|
12 | }
|
13 | }
|
14 |
|
15 | console.log(addCurry(1)(2));
|
16 |
|
17 | console.log(addCurry(1));
|
18 |
|
19 |
|
20 |
|
21 |
|
22 |
|
23 | var addCurryX = addCurry(1);
|
24 | console.log(addCurryX(2));
|
柯里化之后就是先接受add函数的x,然后返回一个函数接受y,在进行计算。我们可以通过addCurry(1)(2)
这种方式一次性传递全部的值来进行调用。
第二次调用时我们只传了x,返回了一个接受y值的函数,所以我们可以将它赋值给一个变量,如addCurryX
随时进行二次调用,这样就做到了代码复用。
提前返回
例如我们给元素绑定点击事件监听时,每次都要判断else if
,柯里化后如果不是IE浏览器的话直接就返回。
1 |
|
2 |
|
3 | var addClickEvent = function(el, fn) {
|
4 | if (window.addEventListener) {
|
5 | el.addEventListener('click', function(event) {
|
6 | fn.call(el, event);
|
7 | });
|
8 | } else if (window.attachEvent) {
|
9 | el.attachEvent("onclick", function(event) {
|
10 | fn.call(el, event);
|
11 | });
|
12 | }
|
13 | };
|
14 |
|
15 | var event = function(){
|
16 | if (window.addEventListener) {
|
17 | return function(el,fn) {
|
18 | el.addEventListener('click', function(event) {
|
19 | fn.call(el, event);
|
20 | });
|
21 | };
|
22 | } else if (window.attachEvent) {
|
23 | return function(el,fn) {
|
24 | el.attachEvent("onclick", function(event) {
|
25 | fn.call(el, event);
|
26 | });
|
27 | };
|
28 | }
|
29 | };
|
30 | event()();
|