柯里化

關於柯里化的概念，網上資料也比較多，這裏就再也不贅述，咱們先來看幾個簡單的例子

需求

求三個數的和

解法：

一、

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

console.log(add(5, 10, 15));

const curryAdd = function(a) {
    return function(b) {
      return function(c) {
        return a + b + c;
      }
    }
}

const curryResult =  curryAdd(5)(10)(15);
 console.log(curryResult);


 const add5 = curryAdd(5);
 const add10 = add5(10);

 console.log(add10(15));

解法2使用了 curry 化，其實柯里化能夠簡單地理解爲將原來接受兩個參數的函數變成新的接受一個參數的過程，新的函數返回一個以原有第二個參數爲參數的函數。

爲何要使用 curry 化

從前面的例子對比來看，curry 化咋一看比簡單的函數使用起來還有複雜，爲何咱們還要大費周章去使用它，其實 curry 化有幾個有點：

• 參數複用

如上面的例子中，返回新的函數保留了對原先函數參數的引用，每次調用計算沒必要從新傳入

• 提早返回，性能優化

關於這個，咱們看個簡單的例子--事件綁定

var addEvent = function() {
  if(window.addEventListener) {

    el.addEventListener(type, function(e) {
      fn.call(el, e);
    }, capture)
      
    }else if(window.attachEvent) {

      el.attachEvent('on' + type, function() {
        fn.call(el, e);
      }, capture)
  }
};

以上例子中須要根據瀏覽器的兼容性進行事件綁定，每次綁定事件都須要判斷一次

改進後：

var addEvent = (function() {
   if(window.addEventListener) {
     return function(el, type, fn, capture) {
       el.addEventListener(type, function(e) {
         fn.call(el, e);
       }, capture)
     }
   }else if(window.attachEvent) {
     return function(el, type, fn, capture) {
       el.attachEvent('on' + type, function() {
         fn.call(el, e);
       }, capture)
     }
   }
 })();

經過自調用函數返回一個新的函數，判斷邏輯只執行了一次