JavaScript函數語言程式設計之深入理解純函式

純函式是函數語言程式設計的基礎，需要重點理解。純函式的作用，可以看《JavaScript函數語言程式設計之為什麼要函數語言程式設計（非嚴謹技術層面的扯淡）》。

純函式的概念：

純函式是這樣一種函式，即相同的輸入，永遠會得到相同的輸出，而且沒有任何可觀察的副作用。

他的重點在於“相同的輸入，永遠會得到相同的輸出”，後面所說的副作用也是為了滿足這一點。

在詳細說明純函式之前，先講兩個其他的概念：可變資料型別和不可變資料型別。

我們知道，在JavaScript中，基本資料型別都是不可變的，他們只能被替換，不能被修改。例如當我們在對字串進行操作的時候，我們並不能改變這個字串本身。

var str = 'I am hero';
console.log(str.toUpperCase());	// "I AM HERO"
console.log(str);	//"I am hero"
複製程式碼

我們能做的只有把返回的新字串重新賦值給變數。

var str = 'I am hero';
str = str.toUpperCase();	// "I AM HERO"
複製程式碼

而引用資料型別都是可變的，存在變數中的僅僅就是一個地址。對於可變特性，facebook的immutable.js做了針對性的強化處理，此外還有clojurescript這樣更加徹底的方式。

為什麼要說這兩個概念呢？

先不說在JS執行的系統環境中可能會產生副作用，單單看這些可變的資料型別，就會增加我們寫純函式的難度，要十分注意，個別情況我們只能選擇接受。

這樣的話，在JS中，我們不妨把純函式換一種方式理解，不要把它當做一個只有“完全滿足要求”和“不滿足要求”的標準，而要把它想象成一個範圍，在這裡有高低不同程度的純函式。

如何理解“相同的輸入，永遠會得到相同的輸出”

文章開頭的純函式的概念中的“永遠”可能會讓你疑惑，要把它放在詞法作用域中考慮，也就是說不考慮再下次執行之前修改常量這一類的情況。

例一

var a = 5;
function A(b) {
  return a + b;
}
A(5);
複製程式碼

A函式是一個純函式嗎？顯然非常不純，在程式執行的過程中，變數a很容易被修改，這就會導致每次呼叫A(5)的返回值改變。

例二

對例一稍作修改

const a = 5;
function A(b) {
  return a + b;
}
A(5);
複製程式碼

這是純函式，確定的輸入，確定的輸出。

例三

把例二數字常量換成物件

const obj = {id: 5};
function A(_obj) {
  return _obj.id;
}
A(obj);
複製程式碼

函式A基本上是純函式，為什麼說是“基本上”？因為有極端情況如下

var obj = {
  get id() {
    return Math.random();
  }
}
複製程式碼

注意，obj在傳進函式A之前是確定的，getter是在取值的時候才會執行，但是返回的結果是不確定的，所以這個時候函式A就不是純函式了。隨機數和Date都會造成函式不純，使用的時候要注意。

除此之外，由於物件是可變資料型別，我們在每次輸入變數obj到函式A中時，並不具有絕對的自信會返回確定的值。可對於函式A來說，它只關心傳進來的資料是什麼，而對於那個資料來說，只要不是上面的極端情況，返回的是確定的值。

例四

const obj = {a: 5};
function A(b) {
  return obj.a + b;
}
A(5);
複製程式碼

這個很明顯很不純，同例一，注意與例三的區別。

例五

對例四稍作修改

const obj = Object.freeze({a: 5});
function A(b) {
  return obj.a + b;
}
A(5);
複製程式碼

這樣就純多了，可是需要注意的是，Object.freeze()這個方法無法凍結巢狀的物件，例如

const obj = Object.freeze({a: {a: 5}});
obj.a.a = 10;
function A(b) {
  return obj.a.a + b;
}
console.log(A(5));	// 15，不純
複製程式碼

例六

function foo(x) {
  return bar(x);
}

function bar(y) {
  return y + 1;
}

foo(1);
複製程式碼

都純。

例七

function A(a) {
  return function(b) {
    return a + b;
  }
}
var B = A(5);
複製程式碼

函式A和函式B是純函式嗎？首先來看函式A，每次輸入一個引數，都會得到一個用這個引數組成的函式，得到的函式是固定的，所以函式A是純函式；再來看函式B雖然看起來好像使用了一個自己外部的變數a，而且這個變數a可能會經常改變，可是，函式B一定要在呼叫了函式A之後才能得到，並且得到了之後，變數a是無法改變的，這就很純了。

即便在返回函式B之前修改了a，例如

例八

function A(a) {
  a = 0;
  return function(b) {
    return a + b;
  }
}
var B = A(5);
複製程式碼

結論也是一樣的。

可如果這樣寫

例九

function A(a) {
  return function(b) {
    return a = a + b;
  }
}
var B = A(5);
複製程式碼

關於副作用，見《JavaScript函數語言程式設計之副作用》

參考資料：

JavaScript函數語言程式設計之深入理解純函式

如何理解“相同的輸入，永遠會得到相同的輸出”

相關文章