JS中的Immutable

Persistent Data Structure（持久化數據結構）
也就是使用舊數據創建新數據時，要保證舊數據同時可用且不變。同時爲了避免 deepCopy 把所有節點都複製一遍帶來的性能損耗，Immutable 使用了 Structural Sharing（結構共享），即如果對象樹中一個節點發生變化，只修改這個節點和受它影響的父節點，其它節點則進行共享。
Immutable 詳解及 React 中實踐

---

Immutable 優點

1. 與深拷貝相比，Immutable最大程度上共用了內存，這與深拷貝是有很大程度上的不同。
   共用內存：
   使用setIn去修改Immutable對象時，未被修改的節點依舊共享。

2. 適用於純函數式編程。純函數編程就是輸入一樣，輸出必定一樣。

3. 可以通過Immutable對象去判斷是否要更新組件，這樣可以提高性能，避免不必要的渲染。

Immutable.is(immutable1, immutable2);

若immutable1與immutable2內容相同，則返回true。否則返回false。
由此我們可以通過is去判斷狀態內容是否改變，決定是否重新渲染。

1. React 建議把 this.state 當作 Immutable 的，因此修改前需要做一個 deepCopy，顯得麻煩。

let newState = Object.assign({}, state);

使用Immutable，使用update進行更新

this.state = Map({name: 'hi'});
this.setState({name: this,state.name.update('name', v=>'my')});

---

Immutable.fromJS是將Object和Array轉化爲Immutable Map和List。

---

Immutable對象的操作

• 獲取immutable對象中的數組元素的某一下標元素。

data = fromJS({
    condition: ['one', 'two', 'three', 'four'];
});
// 獲取'two'
data.getIn(['condition', 1]);

• 獲取immutable數組中的數組大小

data = fromJS({
    condition: ['one', 'two', 'three', 'four'];
});

// 獲取'two'
data.getIn(['condition']).size;