JS中的柯里化 及 精巧的自動柯里化實現

什麼是柯里化？

在計算機科學中，柯里化 （Currying）是把接受多個參數的函數變換成接受一個單一參數（最初函數的第一個參數）的函數，而且返回接受餘下的參數且返回結果的新函數的技術。這個技術由 Christopher Strachey 以邏輯學家 Haskell Curry 命名的，儘管它是 Moses Schnfinkel 和 Gottlob Frege 發明的。

理論看着頭大？不要緊，先看看代碼：

柯里化應用

假設咱們須要實現一個對列表元素進行某種處理的功能，好比說返回一個原列表內每個元素加一的新列表，那麼很容易想到：

const list = [0, 1, 2, 3];
const list1 = list.map(elem => elem + 1); // => [1, 2, 3, 4]

很簡單是吧？若是又要加2呢？

const list = [0, 1, 2, 3];
const list1 = list.map(elem => elem + 1); // => [1, 2, 3, 4]
const list2 = list.map(elem => elem + 2); // => [2, 3, 4, 5]

看上去效率有點低，處理函數封裝下？
但是map的回調函數只接受當前元素 elem 這一個參數，看上去好像沒有辦法封裝...

你也許會想：若是能拿到一個部分配置好的函數就行了，好比說：

// plus返回部分配置好的函數
const plus1 = plus(1);
const plus2 = plus(2);

plus1(5); // => 6
plus2(7); // => 9

把這樣的函數傳進map：

const list = [0, 1, 2, 3];
const list1 = list.map(plus1); // => [1, 2, 3, 4]
const list2 = list.map(plus2); // => [2, 3, 4, 5]

是否是很棒棒？這樣一來不論是加多少，只須要list.map(plus(x))就行了，完美實現了封裝，可讀性大大提升！ (☆ﾟ∀ﾟ)

不過問題來了：
這樣的plus函數要怎麼實現呢？

這時候柯里化就能派上用場了：

柯里化函數

// 原始的加法函數
function origPlus(a, b) {
  return a + b;
}

// 柯里化後的plus函數
function plus(a) {
  return function(b) {
    return a + b;
  }
}

// ES6寫法
const plus = a => b => a + b;

能夠看到，柯里化的 plus 函數首先接受一個參數 a，而後返回一個接受一個參數 b 的函數，因爲閉包的緣由，返回的函數能夠訪問到父函數的參數 a，因此舉個例子：const plus2 = plus(2)就可等效視爲function plus2(b) { return 2 + b; }，這樣就實現了部分配置。

通俗地講，柯里化就是一個部分配置多參數函數的過程，每一步都返回一個接受單個參數的部分配置好的函數。一些極端的狀況可能須要分不少次來部分配置一個函數，好比說屢次相加:

multiPlus(1)(2)(3); // => 6

這種寫法看着很奇怪吧？不過若是入了JS的函數式編程這個大坑的話，這會是常態。（笑）

JS中自動柯里化的精巧實現

柯里化 （Currying）是函數式編程中很重要的一環，不少函數式語言 （eg. Haskell）都會默認將函數自動柯里化。然而JS並不會這樣，所以咱們須要本身來實現自動柯里化的函數。

先上代碼：

// ES5
function curry(fn) {
  function _c(restNum, argsList) {
    return restNum === 0 ?
      fn.apply(null, argsList) :
      function(x) {
        return _c(restNum - 1, argsList.concat(x));
      };
  }
  return _c(fn.length, []);
}

// ES6
const curry = fn => {
  const _c = (restNum, argsList) => restNum === 0 ?
    fn(...argsList) : x => _c(restNum - 1, [...argsList, x]);

  return _c(fn.length, []);
}

/***************** 使用 *********************/

var plus = curry(function(a, b) {
  return a + b;
});

// ES6
const plus = curry((a, b) => a + b);

plus(2)(4); // => 6

這樣就實現了自動的柯里化！(╭￣3￣)╭♡

若是你看得懂發生了什麼的話，那麼恭喜你！你們口中的大佬就是你！╰(°▽°)╯，快留下贊而後去開始你的函數式生涯吧（滑稽

若是你沒看懂發生了什麼，別擔憂，我如今開始幫你理一下思路。

需求分析

咱們須要一個 curry 函數，它接受一個待柯里化的函數爲參數，返回一個用於接收一個參數的函數，接收到的參數放到一個列表中，當參數數量足夠時，執行原函數並返回結果。

實現方式

簡單思考能夠知道，柯里化部分配置函數的步驟數等於 fn 的參數個數，也就是說有兩個參數的 plus 函數須要分兩步來部分配置。函數的參數個數能夠經過fn.length獲取。

總的想法就是每傳一次參，就把該參數放入一個參數列表 argsList 中，若是已經沒有要傳的參數了，那麼就調用fn.apply(null, argsList)將原函數執行。要實現這點，咱們就須要一個內部的判斷函數 _c(restNum, argsList)，函數接受兩個參數，一個是剩餘參數個數 restNum，另外一個是已獲取的參數的列表 argsList；_c 的功能就是判斷是否還有未傳入的參數，當 restNum 爲零時，就是時候經過fn.apply(null, argsList)執行原函數並返回結果了。若是還有參數須要傳遞的話，也就是說 restNum 不爲零時，就須要返回一個單參數函數

function(x) {
  return _c(restNum - 1, argsList.concat(x));
}

來繼續接收參數。這裏造成了一個尾遞歸，函數接受了一個參數後，剩餘須要參數數量 restNum 減一，並將新參數 x 加入 argsList 後傳入 _c 進行遞歸調用。結果就是，當參數數量不足時，返回負責接收新參數的單參數函數，當參數夠了時，就調用原函數並返回。

如今再來看：

function curry(fn) {
  function _c(restNum, argsList) {
    return restNum === 0 ?
      fn.apply(null, argsList) :
      function(x) {
        return _c(restNum - 1, argsList.concat(x));
      };
  }
  return _c(fn.length, []); // 遞歸開始
}

是否是開始清晰起來了？ (ﾟ▽ﾟ)

ES6寫法的因爲使用了 數組解構 及 箭頭函數 等語法糖，看上去精簡不少，不過思想都是同樣的啦～

// ES6
const curry = fn => {
  const _c = (restNum, argsList) => restNum === 0 ?
    fn(...argsList) : x => _c(restNum - 1, [...argsList, x]);

  return _c(fn.length, []);
}

與其餘方法的對比

還有一種你們經常使用的方法：

function curry(fn) {
  const len = fn.length;
  return function judge(...args1) {
    return args1.length >= len ?
    fn(...args1):
    function(...args2) {
      return judge(...[...args1, ...args2]);
    }
  }
}

// 使用箭頭函數
const curry = fn => {
  const len = fn.length;
  const judge = (...args1) => args1.length >= len ?
    fn(...args1) : (...args2) => judge(...[...args1, ...args2]);
  return judge;
}

與本篇文章先前提到的方法對比的話，發現這種方法有兩個問題：

1. 依賴ES6的解構（函數參數中的 ...args1 與 ...args2）；
2. 性能稍差一點。

性能問題

作個測試：

console.time("curry");

const plus = curry((a, b, c, d, e) => a + b + c + d + e);
plus(1)(2)(3)(4)(5);

console.timeEnd("curry");

在個人電腦（Manjaro Linux，Intel Xeon E5 2665，32GB DDR3 四通道1333Mhz，Node.js 9.2.0）上：

• 本篇提到的方法耗時約 0.325ms
• 其餘方法的耗時約 0.345ms

差的這一點猜想是閉包的緣由。因爲閉包的訪問比較耗性能，而這種方式造成了兩個閉包：fn 和 len，前面提到的方法只造成了 fn 一個閉包，因此形成了這一微小的差距。

也但願你們能本身測試下並說說本身的見解～

有問題歡迎留言～ ⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄.

<!-- End -->