簡單理解JavaScript中的柯里化和反柯里化

FREAKFILTH發表於2017-02-16

就像最早聽到斐波拉切數列一樣,第一次聽到柯里化我也是懵逼的

本文參考:

  1. JavaScript設計模式與開發實踐

  2. Currying in JavaScript

  3. Curried JavaScript functions

前言

本文旨在讓大家簡單理解柯里化和反柯里化,這裡不做深入探究,只求能帶大裝潢逼就好,看完還不懂你砍我。

我們先來簡單瞭解一下他們的作用。

柯里化又稱部分求值,字面意思就是不會立刻求值,而是到了需要的時候再去求值。如果看的懵逼,沒事,看完整篇文章再回過頭來看這裡你就會豁然開朗。

反柯里化的作用是,當我們呼叫某個方法,不用考慮這個物件在被設計時,是否擁有這個方法,只要這個方法適用於它,我們就可以對這個物件使用它。

柯里化(curring)

我們有這樣一個場景,記錄程式設計師一個月的加班總時間,那麼好,我們首先要做的是記錄程式設計師每天加班的時間,然後把一個月中每天的加班的時間相加,就得到了一個月的加班總時間。

但問題來了,我們有很多種方法可以實現它,比如最簡單的:

var monthTime = 0;

function overtime(time) {
 return monthTime += time;
}

overtime(3.5);    // 第一天
overtime(4.5);    // 第二天
overtime(2.1);    // 第三天
//...

console.log(monthTime);    // 10.1複製程式碼

每次傳入加班時間都進行累加,這樣當然沒問題,但你知道,如果資料量很大的情況下,這樣會大大犧牲效能。

那怎麼辦?這就是柯里化要解決的問題。

其實我們不必每天都計算加班時間,只需要儲存好每天的加班時間,在月底時計算這個月總共的加班時間,所以,其實只需要在月底計算一次就行。

下面的overtime函式還不是一個柯里化函式的完整實現,但可以幫助我們瞭解其核心思想:

var overtime = (function() {
  var args = [];

  return function() {
    if(arguments.length === 0) {
      var time = 0;
      for (var i = 0, l = args.length; i < l; i++) {
        time += args[i];
      }
      return time;
    }else {
      [].push.apply(args, arguments);
    }
  }
})();

overtime(3.5);    // 第一天
overtime(4.5);    // 第二天
overtime(2.1);    // 第三天
//...

console.log( overtime() );    // 10.1複製程式碼

柯里化的核心思想就是這樣,看到這裡你肯定已經懂了,至於真正的柯里化函式,網上有很多,大家可以去Google一下。

反柯里化(uncurring)

反柯里化的的作用已經在前言說過了,這裡講下它的由來。

2011年JavaScript之父Brendan Eich發表了一篇Twitter,提出了反柯里化這個思想,下面這段程式碼是反柯里化的實現方式之一:

Function.prototype.uncurring = function() {
  var self = this;
  return function() {
    var obj = Array.prototype.shift.call(arguments);
    return self.apply(obj, arguments);
  };
};複製程式碼

我們先來看看上面這段程式碼有什麼作用。

我們要把Array.prototype.push方法轉換成一個通用的push函式,只需要這樣做:

var push = Array.prototype.push.uncurring();

//測試一下
(function() {
  push(arguments, 4);
  console.log(arguments); //[1, 2, 3, 4]
})(1, 2, 3)複製程式碼

arguments本來是沒有push方法的,通常,我們都需要用Array.prototype.push.call來實現push方法,但現在,直接呼叫push函式,既簡潔又意圖明瞭。

就和前言寫的那樣,我們不用考慮物件是否擁有這個方法,只要它適用於這個方法,那就可以使用這個方法(類似於鴨子型別)。

我們來分析一下呼叫Array.prototype.push.uncurring()這句程式碼時,發生了什麼事情:

Function.prototype.uncurring = function() {
  var self = this;  //self此時是Array.prototype.push

  return function() {
    var obj = Array.prototype.shift.call(arguments);
    //obj 是{
    //  "length": 1,
    //  "0": 1
    //}
    //arguments的第一個物件被截去(也就是呼叫push方法的物件),剩下[2]

    return self.apply(obj, arguments);
    //相當於Array.prototype.push.apply(obj, 2);
  };
};

//測試一下
var push = Array.prototype.push.uncurring();
var obj = {
  "length": 1,
  "0" : 1
};

push(obj, 2);
console.log( obj ); //{0: 1,1: 2, length: 2 }複製程式碼

看到這裡你應該對柯里化和反柯里化有了一個初步的認識了,但要熟練的運用在開發中,還需要我們更深入的去了解它們內在的含義。

喜歡本文的朋友可以關注我的微信公眾號,不定期推送一些好文。

簡單理解JavaScript中的柯里化和反柯里化

本文出自Rockjins Blog,轉載請與作者聯絡。否則將追究法律責任。

相關文章