轉(zhuǎn)自 - https://segmentfault.com/a/1190000002909224
轉(zhuǎn)自 - https://zhuanlan.zhihu.com/purerender/20295971
轉(zhuǎn)自 - https://www.w3cplus.com/javascript/immutable-js.html
（轉(zhuǎn)）什么是 Immutable Data
Immutable Data 就是一旦創(chuàng)建慷丽，就不能再被更改的數(shù)據(jù)。對 Immutable 對象的任何修改或添加刪除操作都會返回一個新的 Immutable 對象鳄哭。Immutable 實(shí)現(xiàn)的原理是 Persistent Data Structure（持久化數(shù)據(jù)結(jié)構(gòu)）要糊，也就是使用舊數(shù)據(jù)創(chuàng)建新數(shù)據(jù)時，要保證舊數(shù)據(jù)同時可用且不變妆丘。同時為了避免 deepCopy 把所有節(jié)點(diǎn)都復(fù)制一遍帶來的性能損耗锄俄，Immutable 使用了 Structural Sharing（結(jié)構(gòu)共享），即如果對象樹中一個節(jié)點(diǎn)發(fā)生變化勺拣，只修改這個節(jié)點(diǎn)和受它影響的父節(jié)點(diǎn)奶赠，其它節(jié)點(diǎn)則進(jìn)行共享。請看下面動畫：
Immutable有什么用
Immutable Data是指一旦被創(chuàng)造后药有，就不可以被改變的數(shù)據(jù)毅戈。
通過使用Immutable Data苹丸，可以讓我們更容易的去處理緩存、回退苇经、數(shù)據(jù)變化檢測等問題赘理，簡化我們的開發(fā)
Immutable的優(yōu)點(diǎn)
- 使得數(shù)據(jù)可以被回溯，由于每次更改都不改變原數(shù)據(jù)扇单，類似撤回等功能很容就可以實(shí)現(xiàn)
- 節(jié)省內(nèi)存商模，Immutable.js 使用了 Structure Sharing 會盡量復(fù)用內(nèi)存，甚至以前使用的對象也可以再次被復(fù)用蜘澜。沒有被引用的對象會被垃圾回收施流。
- Immutable 本身就是函數(shù)式編程中的概念，純函數(shù)式編程比面向?qū)ο蟾m用于前端開發(fā)鄙信。因?yàn)橹灰斎胍恢碌纱祝敵霰厝灰恢拢@樣開發(fā)的組件更易于調(diào)試和組裝扮碧。
使用 Immutable 的缺點(diǎn)
- 需要學(xué)習(xí)新的 API
- 增加了資源文件大小
- 容易與原生對象混淆
這點(diǎn)是我們使用 Immutable.js 過程中遇到最大的問題趟章。寫代碼要做思維上的轉(zhuǎn)變。
雖然 Immutable.js 盡量嘗試把 API 設(shè)計的原生對象類似慎王，有的時候還是很難區(qū)別到底是 Immutable 對象還是原生對象，容易混淆操作宏侍。
Immutable.js 的 API 主要包含以下幾部分：
-
formJS()赖淤，將 JavaScript Object 和 Array 徹底轉(zhuǎn)換為 Immutable Map 和 List -
is()，與Object.is()類似都是對值的比較谅河，但它會將 Immutable Iterable 視為值類型數(shù)據(jù)而不是引用類型數(shù)據(jù)咱旱，如果兩個 Immutable Iterable 的值相等，則返回 true绷耍。與Object.is()不同的是吐限，is(0, -0)的結(jié)果為true -
List，有序索引集褂始，類似于 JavaScript 中的 Array -
Map诸典，無序 Iterable，讀寫 Key 的復(fù)雜度為O(log32 N) -
OrderedMap崎苗，有序 Map狐粱，排序依據(jù)是數(shù)據(jù)的 set() 操作 -
Set，元素為獨(dú)一無二的集合胆数，添加數(shù)據(jù)和判斷數(shù)據(jù)是否存在的復(fù)雜度為O(log32 N) -
OrderedSet肌蜻，有序 Set，排序依據(jù)是數(shù)據(jù)的 add 操作必尼。 -
Stack蒋搜，有序集合，且使用unshift(v)和shift()進(jìn)行添加和刪除操作的復(fù)雜度為O(1) -
Range()，返回一個 Seq.Indexed 類型的數(shù)據(jù)集合豆挽，該方法接收三個參數(shù)(start = 1, end = infinity, step = 1)酸休，分別表示起始點(diǎn)、終止點(diǎn)和步長祷杈，如果 start 等于 end斑司，則返回空的數(shù)據(jù)結(jié)合 -
Repeat()，返回一個 Seq.indexed 類型的數(shù)據(jù)結(jié)合但汞，該方法接收兩個參數(shù)(value宿刮，times)，value 表示重復(fù)生成的值私蕾，times 表示重復(fù)生成的次數(shù)僵缺，如果沒有指定times，則表示生成的Seq包含無限個value -
Record踩叭，用于衍生新的 Record 類磕潮，進(jìn)而生成 Record 實(shí)例。Record 實(shí)例類似于 JavaScript 中的 Object 實(shí)例容贝，但只接收特定的字符串作為 key自脯，且擁有默認(rèn)值 -
Seq，序列（may not be backed by a concrete data structure） -
Iterable斤富，可以被迭代的(Key, Value)鍵值對集合膏潮，是 Immutable.js 中其他所有集合的基類，為其他所有集合提供了 基礎(chǔ)的 Iterable 操作函數(shù)（比如map()和filter） -
Collection满力，創(chuàng)建 Immutable 數(shù)據(jù)結(jié)構(gòu)的最基礎(chǔ)的抽象類焕参，不能直接構(gòu)造該類型
例：Record 用法
Record 在表現(xiàn)上類似于 ES6 中的 Class，但在某些細(xì)節(jié)上還有所不同油额。通過 Record() 可以創(chuàng)建一個新的 Record 類叠纷，使用該類可以創(chuàng)建具體的 Record 實(shí)例，該實(shí)例包含在 Record() 構(gòu)造函數(shù)中聲明的所有屬性和默認(rèn)值潦嘶。如果 Record 實(shí)例中的某個屬性被刪除了或者沒有聲明涩嚣，則只會將實(shí)例中的屬性值設(shè)置為默認(rèn)值
創(chuàng)建 Record 實(shí)例 const A = Record({ a: 1, b: 2 });
const r = new A({ a: 3 });
// => Record { "a": 3, "b": 2 }
刪除實(shí)例屬性 const rr = r.remove('a');
// => Record { "a": 1, "b": 2 }
此外，Record 實(shí)例還具有擴(kuò)展性：
class ABRecord extends Record({a:1,b:2}) {
getAB() {
return this.a + this.b;
}
}
var myRecord = new ABRecord({b: 3})
myRecord.getAB()
// => 4
import Immutable from 'immutable';
const ARecord = Immutable.Record({
myID: null,
myName: null,
myPhone: null,
myAddress: null,
myAge: null,
mySex:null,
});
export default class MyRecord extends ARecord {
getMyAge(){
return 18;
}
}
let myrecord = new MyRecord({
myID: 737427428,
myName: '張三',
myPhone: '1234567890',
myAddress: '北京',
myAge: 18,
mySex:'男',
// 如果其中一個屬性沒聲明衬以，就是默認(rèn)的 null
})缓艳；
myrecord.abc();
