本篇只是對(duì)Immutable.js的簡(jiǎn)單介紹，后續(xù)會(huì)繼續(xù)分享其具體實(shí)踐應(yīng)用。
什么是Immutable Data和泌？
Immutable data encourages pure functions (data-in, data-out) and lends itself to much simpler application development and enabling techniques from functional programming such as lazy evaluation.
-- 官方文檔對(duì)其描述
Immutable Data 就是一旦創(chuàng)建，就不能再被更改的數(shù)據(jù)祠肥。對(duì) Immutable 對(duì)象的任何修改或添加刪除操作都會(huì)返回一個(gè)新的 Immutable 對(duì)象武氓。Immutable 實(shí)現(xiàn)的原理是 Persistent Data Structure（持久化數(shù)據(jù)結(jié)構(gòu)），也就是使用舊數(shù)據(jù)創(chuàng)建新數(shù)據(jù)時(shí)仇箱，要保證舊數(shù)據(jù)同時(shí)可用且不變县恕。同時(shí)為了避免 deepCopy 把所有節(jié)點(diǎn)都復(fù)制一遍帶來(lái)的性能損耗，Immutable 使用了Structural Sharing（結(jié)構(gòu)共享）剂桥，即如果對(duì)象樹(shù)中一個(gè)節(jié)點(diǎn)發(fā)生變化忠烛，只修改這個(gè)節(jié)點(diǎn)和受它影響的父節(jié)點(diǎn)，其它節(jié)點(diǎn)則進(jìn)行共享权逗。請(qǐng)看下面動(dòng)畫：
Immutable的優(yōu)缺點(diǎn)一覽
優(yōu)點(diǎn)
1. 降低 Mutable 帶來(lái)的復(fù)雜度
共享的可變狀態(tài)是萬(wàn)惡之源美尸，舉個(gè)簡(jiǎn)單的例子就是js中的引用賦值：
var obj = { a: 1 };
var copy_obj = obj;
copy_obj.a = 2;
console.log(obj.a); // 2
引用賦值雖然可以節(jié)省內(nèi)存冤议，但當(dāng)應(yīng)用復(fù)雜之后，可變狀態(tài)往往會(huì)變成噩夢(mèng)师坎，通常一般的做法是使用shallowCopy或者deepCopy來(lái)避免被修改恕酸，但這樣造成了CPU和內(nèi)存的消耗，不過(guò)Immulate可以很好地解決這些問(wèn)題胯陋。
2. 節(jié)省內(nèi)存空間
上面提到了結(jié)構(gòu)共享蕊温，Immutable.js 使用這種方式會(huì)盡量復(fù)用內(nèi)存，甚至以前使用的對(duì)象也可以再次被復(fù)用遏乔。沒(méi)有被引用的對(duì)象會(huì)被垃圾回收寿弱。
import { Map } from 'immutable';
let a = Map({
select: 'users',
filter: Map({ name: 'Cam' })
})
let b = a.set('select', 'people');
a === b; // false
a.get('filter') === b.get('filter'); // true
上面 a 和 b 共享了沒(méi)有變化的 filter 節(jié)點(diǎn)。
3. Undo/Redo按灶，Copy/Paste，隨意穿越筐咧！
因?yàn)槊看螖?shù)據(jù)都是不一樣的鸯旁，只要把這些數(shù)據(jù)放到一個(gè)數(shù)組里儲(chǔ)存起來(lái)，想回退到哪里就拿出對(duì)應(yīng)數(shù)據(jù)即可量蕊，很容易開(kāi)發(fā)出撤銷重做這種功能铺罢。
4. 擁抱函數(shù)式編程
Immutable（持久化數(shù)據(jù)結(jié)構(gòu)）本身就是函數(shù)式編程中的概念。函數(shù)式編程關(guān)心數(shù)據(jù)的映射残炮，命令式編程關(guān)心解決問(wèn)題的步驟韭赘，純函數(shù)式編程比面向?qū)ο蟾m用于前端開(kāi)發(fā)。因?yàn)橹灰斎胍恢率凭停敵霰厝灰恢氯埃@樣開(kāi)發(fā)的組件更易于調(diào)試和組裝。
缺點(diǎn)
拋開(kāi)學(xué)習(xí)成本和額外引入的資源文件這些不說(shuō)苞冯，我們來(lái)看看使用過(guò)程中有哪些不爽的地方袖牙。
1. 容易與原生對(duì)象混
主要是Immutable的API設(shè)計(jì)的和原生對(duì)象類似，容易混淆操作舅锄。例如其中Map和List的操作：
// Immutable
const map = Map({ a: 1, b: 2 });
const list = List([1,2,3]);
// 原生js
const obj = { a: 1, b: 2 };
const arry = [1,2,3];
// 取值方式對(duì)比
console.log(map.get('a'));
console.log(list.get(0));
console.log(obj.a);
console.log(arry[0]);
Immutable.js簡(jiǎn)介
Facebook 工程師 Lee Byron 花費(fèi) 3 年時(shí)間打造鞭达，與 React 同期出現(xiàn)，但沒(méi)有被默認(rèn)放到 React 工具集里（React 提供了簡(jiǎn)化的 Helper）皇忿。它內(nèi)部實(shí)現(xiàn)了一套完整的 Persistent Data Structure畴蹭，還有很多易用的數(shù)據(jù)類型鳍烁。像 Collection叨襟、List、Map汽纠、Set、Record梆暮、Seq寺庄。有非常全面的map、filter力崇、groupBy斗塘、reduce``find函數(shù)式操作方法。同時(shí) API 也盡量與 Object 或 Array 類似餐曹。
Immutable.js 的幾種數(shù)據(jù)類型
- List: 有序索引集逛拱，類似JavaScript中的Array。
- Map: 無(wú)序索引集台猴，類似JavaScript中的Object朽合。
- OrderedMap: 有序的Map，根據(jù)數(shù)據(jù)的set()進(jìn)行排序饱狂。
- Set: 沒(méi)有重復(fù)值的集合曹步。
- OrderedSet: 有序的Set，根據(jù)數(shù)據(jù)的add進(jìn)行排序休讳。
- Stack: 有序集合讲婚，支持使用unshift()和shift()添加和刪除。
- Record: 一個(gè)用于生成Record實(shí)例的類俊柔。類似于JavaScript的Object筹麸，但是只接收特定字符串為key活合，具有默認(rèn)值。
- Seq: 序列物赶，但是可能不能由具體的數(shù)據(jù)結(jié)構(gòu)支持白指。
- Collection: 是構(gòu)建所有數(shù)據(jù)結(jié)構(gòu)的基類，不可以直接構(gòu)建酵紫。
用的最多就是List和Map告嘲，所以在這里主要介紹這兩種數(shù)據(jù)類型的API。
Immutable.js 的常用API
fromJS()
作用：將一個(gè)js數(shù)據(jù)轉(zhuǎn)換為Immutable類型的數(shù)據(jù)
用法：fromJS(value, converter)
簡(jiǎn)介：value是要轉(zhuǎn)變的數(shù)據(jù)奖地，converter是要做的操作橄唬。第二個(gè)參數(shù)可不填，默認(rèn)情況會(huì)將數(shù)組準(zhǔn)換為L(zhǎng)ist類型参歹，將對(duì)象轉(zhuǎn)換為Map類型仰楚，其余不做操作
代碼實(shí)現(xiàn)：
const obj = Immutable.fromJS({a:'123',b:'234'},function (key, value, path) {
console.log(key, value, path)
return isIndexed(value) ? value.toList() : value.toOrderedMap())
})
toJS()
作用：將一個(gè)Immutable數(shù)據(jù)轉(zhuǎn)換為JS類型的數(shù)據(jù)
用法：value.toJS()
is()
作用：對(duì)兩個(gè)對(duì)象進(jìn)行比較
用法：is(map1,map2)
簡(jiǎn)介：和js中對(duì)象的比較不同，在js中比較兩個(gè)對(duì)象比較的是地址犬庇，但是在Immutable中比較的是這個(gè)對(duì)象hashCode和valueOf缸血，只要兩個(gè)對(duì)象的hashCode相等，值就是相同的械筛，避免了深度遍歷，提高了性能
代碼實(shí)現(xiàn)：
import { Map, is } from 'immutable'
const map1 = Map({ a: 1, b: 1, c: 1 })
const map2 = Map({ a: 1, b: 1, c: 1 })
map1 === map2 //false
Object.is(map1, map2) // false
is(map1, map2) // true
List() 和 Map()
作用：用來(lái)創(chuàng)建一個(gè)新的List/Map對(duì)象
用法:
//List
Immutable.List(); // 空List
Immutable.List([1, 2]);
//Map
Immutable.Map(); // 空Map
Immutable.Map({ a: '1', b: '2' });
List.isList() 和 Map.isMap()
作用：判斷一個(gè)數(shù)據(jù)結(jié)構(gòu)是不是List/Map類型
用法：
List.isList([]); // false
List.isList(List()); // true
Map.isMap({}) // false
Map.isMap(Map()) // true
size
作用：屬性飒炎，獲取List/Map的長(zhǎng)度埋哟，等同于ImmutableData.count();
get() 、 getIn()
作用：獲取數(shù)據(jù)結(jié)構(gòu)中的數(shù)據(jù)
//獲取List索引的元素
ImmutableData.get(0);
// 獲取Map對(duì)應(yīng)key的value
ImmutableData.get('a');
// 獲取嵌套數(shù)組中的數(shù)據(jù)
ImmutableData.getIn([1, 2]);
// 獲取嵌套map的數(shù)據(jù)
ImmutableData.getIn(['a', 'b']);
has() 郎汪、 hasIn()
作用：判斷是否存在某一個(gè)key
用法：
Immutable.fromJS([1,2,3,{a:4,b:5}]).has('0'); //true
Immutable.fromJS([1,2,3,{a:4,b:5}]).has('0'); //true
Immutable.fromJS([1,2,3,{a:4,b:5}]).hasIn([3,'b']) //true
includes()
作用：判斷是否存在某一個(gè)value
用法：
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes(2); //true
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes('2'); //false 不包含字符2
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes(5); //false
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes({a:4,b:5}) //false
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes(Immutable.fromJS({a:4,b:5})) //true
first() 赤赊、 last()
作用：用來(lái)獲取第一個(gè)元素或者最后一個(gè)元素，若沒(méi)有則返回undefined
代碼：
Immutable.fromJS([1,2,3,{a:4,b:5}]).first()//1
Immutable.fromJS([1,2,3,{a:4,b:5}]).last()//{a:4,b:5}
Immutable.fromJS({a:1,b:2,c:{d:3,e:4}}).first() //1
Immutable.fromJS({a:1,b:2,c:{d:3,e:4}}).first() //{d:3,e:4}
數(shù)據(jù)修改
注：這里對(duì)于數(shù)據(jù)的修改煞赢，是對(duì)原數(shù)據(jù)進(jìn)行操作后的值賦值給一個(gè)新的數(shù)據(jù)抛计，并不會(huì)對(duì)原數(shù)據(jù)進(jìn)行修改，因?yàn)镮mmutable是不可變的數(shù)據(jù)類型照筑。
設(shè)置 set()
作用：設(shè)置第一層key吹截、index的值
用法：
const originalList = List([ 0 ]);
// List [ 0 ]
originalList.set(1, 1);
// List [ 0, 1 ]
originalList.set(0, 'overwritten');
// List [ "overwritten" ]
originalList.set(2, 2);
// List [ 0, undefined, 2 ]
List().set(50000, 'value').size;
// 50001
const originalMap = Map()
const newerMap = originalMap.set('key', 'value')
const newestMap = newerMap.set('key', 'newer value')
originalMap
// Map {}
newerMap
// Map { "key": "value" }
newestMap
// Map { "key": "newer value" }
List在使用的時(shí)候，將index為number值設(shè)置為value凝危。Map在使用的時(shí)候波俄，將key的值設(shè)置為value。
在List中使用時(shí)蛾默，若傳入的number為負(fù)數(shù)懦铺，則將index為size+index的值設(shè)置為value，例支鸡，若傳入-1冬念，則將size-1的值設(shè)為value趁窃。若傳入的number的值超過(guò)了List的長(zhǎng)度，則將List自動(dòng)補(bǔ)全為傳入的number的值急前，將number設(shè)置為value醒陆，其余用undefined補(bǔ)全。注：跟js中不同叔汁，List中不存在空位统求，[,,,],List中若沒(méi)有值，則為undefined据块。
setIn()
作用：設(shè)置深層結(jié)構(gòu)中某屬性的值
用法：
const originalMap = Map({
subObject: Map({
subKey: 'subvalue',
subSubObject: Map({
subSubKey: 'subSubValue'
})
})
})
const newMap = originalMap.setIn(['subObject', 'subKey'], 'ha ha!')
// Map {
// "subObject": Map {
// "subKey": "ha ha!",
// "subSubObject": Map { "subSubKey": "subSubValue" }
// }
// }
const newerMap = originalMap.setIn(
['subObject', 'subSubObject', 'subSubKey'],
'ha ha ha!'
)
// Map {
// "subObject": Map {
// "subKey": "subvalue",
// "subSubObject": Map { "subSubKey": "ha ha ha!" }
// }
// }
用法與set()一樣码邻，只是第一個(gè)參數(shù)是一個(gè)數(shù)組，代表要設(shè)置的屬性所在的位置
刪除 delete
作用：用來(lái)刪除第一層結(jié)構(gòu)中的屬性
用法：
// List
List([ 0, 1, 2, 3, 4 ]).delete(0);
// List [ 1, 2, 3, 4 ]
// Map
const originalMap = Map({
key: 'value',
otherKey: 'other value'
})
// Map { "key": "value", "otherKey": "other value" }
originalMap.delete('otherKey')
// Map { "key": "value" }
deleteIn()
用來(lái)刪除深層數(shù)據(jù)另假，用法參考setIn
deleteAll() (Map獨(dú)有像屋，List沒(méi)有)
作用：用來(lái)刪除Map中的多個(gè)key
用法：deleteAll(keys: Iterable<K>): this
代碼示例：
const names = Map({ a: "Aaron", b: "Barry", c: "Connor" })
names.deleteAll([ 'a', 'c' ])
// Map { "b": "Barry" }
更新 update()
作用：對(duì)對(duì)象中的某個(gè)屬性進(jìn)行更新，可對(duì)原數(shù)據(jù)進(jìn)行相關(guān)操作
用法：
////List
const list = List([ 'a', 'b', 'c' ])
const result = list.update(2, val => val.toUpperCase())
///Map
const aMap = Map({ key: 'value' })
const newMap = aMap.update('key', value => value + value)
updateIn()
用法參考setIn
清除 clear()
作用：清除所有數(shù)據(jù)
用法：clear(): this
代碼示例：
Map({ key: 'value' }).clear() //Map
List([ 1, 2, 3, 4 ]).clear() // List
List中的各種刪除與插入
List對(duì)應(yīng)的數(shù)據(jù)結(jié)構(gòu)是js中的數(shù)組边篮，所以數(shù)組的一些方法在Immutable中也是通用的己莺，比如push，pop,shift戈轿，
unshift凌受，insert。
push()
在List末尾插入一個(gè)元素
pop()
在List末尾刪除一個(gè)元素
unshift
在List首部插入一個(gè)元素
shift
在List首部刪除一個(gè)元素
insert
在List的index處插入元素
代碼實(shí)現(xiàn)：
List([ 0, 1, 2, 3, 4 ]).insert(6, 5)
//List [ 0, 1, 2, 3, 4, 5 ]
List([ 1, 2, 3, 4 ]).push(5)
// List [ 1, 2, 3, 4, 5 ]
List([ 1, 2, 3, 4 ]).pop()
// List[ 1, 2, 3 ]
List([ 2, 3, 4]).unshift(1);
// List [ 1, 2, 3, 4 ]
List([ 0, 1, 2, 3, 4 ]).shift();
// List [ 1, 2, 3, 4 ]
List中還有一個(gè)特有的方法用法設(shè)置List的長(zhǎng)度思杯，setSize()
List([]).setSize(2).toJS() //[undefined,undefined]
關(guān)于merge
merge
作用：淺合并胜蛉，新數(shù)據(jù)與舊數(shù)據(jù)對(duì)比，舊數(shù)據(jù)中不存在的屬性直接添加色乾，就數(shù)據(jù)中已存在的屬性用新數(shù)據(jù)中的覆蓋
mergrWith
作用：自定義淺合并誊册，可自行設(shè)置某些屬性的值
mergeIn
作用：對(duì)深層數(shù)據(jù)進(jìn)行淺合并
mergeDeep
作用：深合并，新舊數(shù)據(jù)中同時(shí)存在的的屬性為新舊數(shù)據(jù)合并之后的數(shù)據(jù)
mergeDeepIn
作用：對(duì)深層數(shù)據(jù)進(jìn)行深合并
mergrDeepWith
作用：自定義深合并暖璧，可自行設(shè)置某些屬性的值
這里用一段示例徹底搞懂merge案怯，此示例為Map結(jié)構(gòu)，List與Map原理相同
const Map1 = Immutable.fromJS({a:111,b:222,c:{d:333,e:444}});
const Map2 = Immutable.fromJS({a:111,b:222,c:{e:444,f:555}});
const Map3 = Map1.merge(Map2);
//Map {a:111,b:222,c:{e:444,f:555}}
const Map4 = Map1.mergeDeep(Map2);
//Map {a:111,b:222,c:{d:333,e:444,f:555}}
const Map5 = Map1.mergeWith((oldData,newData,key)=>{
if(key === 'a'){
return 666;
}else{
return newData
}
},Map2);
//Map {a:666,b:222,c:{e:444,f:555}}
序列算法
concat()
作用：對(duì)象的拼接澎办，用法與js數(shù)組中的concat()相同嘲碱，返回一個(gè)新的對(duì)象。
用法：const List = list1.concat(list2)
map()
作用：遍歷整個(gè)對(duì)象局蚀，對(duì)Map/List元素進(jìn)行操作悍汛，返回一個(gè)新的對(duì)象。
用法：
Map({a:1,b:2}).map(val=>10*val)
//Map{a:10,b:20}
Map特有的mapKey()
作用：遍歷整個(gè)對(duì)象至会，對(duì)Map元素的key進(jìn)行操作离咐，返回一個(gè)新的對(duì)象。
用法：
Map({a:1,b:2}).mapKey(val=>val+'l')
//Map{al:10,bl:20}
Map特有的mapEntries()
作用：遍歷整個(gè)對(duì)象，對(duì)Map元素的key和value同時(shí)進(jìn)行操作宵蛀，返回一個(gè)新的對(duì)象昆著。Map的map()也可實(shí)現(xiàn)此功能。
用法：
Map({a:1,b:2}).map((key,val)=>{
return [key+'l',val*10]
})
//Map{al:10,bl:20}
過(guò)濾 filter
作用：返回一個(gè)新的對(duì)象术陶，包括所有滿足過(guò)濾條件的元素
用法：
Map({a:1,b:2}).filter((key,val)=>{
return val == 2
})
//Map{b:2}
還有一個(gè)filterNot()方法紊馏，與此方法正好相反笙僚。
反轉(zhuǎn) reverse
作用：將數(shù)據(jù)的結(jié)構(gòu)進(jìn)行反轉(zhuǎn)
代碼示例：
Immutable.fromJS([1, 2, 3, 4, 5]).reverse();
// List [5,4,3,2,1]
Immutable.fromJS({a:1,b:{c:2,d:3},e:4}).recerse();
//Map {e:4,b:{c:2,d:3},a:1}
排序 sort & sortBy
作用：對(duì)數(shù)據(jù)結(jié)構(gòu)進(jìn)行排序
代碼示例：
///List
Immutable.fromJS([4,3,5,2,6,1]).sort()
// List [1,2,3,4,5,6]
Immutable.fromJS([4,3,5,2,6,1]).sort((a,b)=>{
if (a < b) { return -1; }
if (a > b) { return 1; }
if (a === b) { return 0; }
})
// List [1,2,3,4,5,6]
Immutable.fromJS([{a:3},{a:2},{a:4},{a:1}]).sortBy((val,index,obj)=>{
return val.get('a')
},(a,b)=>{
if (a < b) { return -1; }
if (a > b) { return 1; }
if (a === b) { return 0; }
})
//List [ {a:3}, {a:2}, {a:4}, {a:1} ]
//Map
Immutable.fromJS( {b:1, a: 3, c: 2, d:5} ).sort()
//Map {b: 1, c: 2, a: 3, d: 5}
Immutable.fromJS( {b:1, a: 3, c: 2, d:5} ).sort((a,b)=>{
if (a < b) { return -1; }
if (a > b) { return 1; }
if (a === b) { return 0; }
})
//Map {b: 1, c: 2, a: 3, d: 5}
Immutable.fromJS( {b:1, a: 3, c: 2, d:5} ).sortBy((value, key, obj)=> {
return value
})
//Map {b: 1, c: 2, a: 3, d: 5}
分組 groupBy
作用：對(duì)數(shù)據(jù)進(jìn)行分組
const listOfMaps = List([
Map({ v: 0 }),
Map({ v: 1 }),
Map({ v: 1 }),
Map({ v: 0 }),
Map({ v: 2 })
])
const groupsOfMaps = listOfMaps.groupBy(x => x.get('v'))
// Map {
// 0: List [ Map{ "v": 0 }, Map { "v": 0 } ],
// 1: List [ Map{ "v": 1 }, Map { "v": 1 } ],
// 2: List [ Map{ "v": 2 } ],
// }
查找數(shù)據(jù)
indexOf() 敌蚜、 lastIndexOf Map不存在此方法
作用：和js數(shù)組中的方法相同蛇尚，查找第一個(gè)或者最后一個(gè)value的index值，找不到則返回-1
用法：
Immutable.fromJS([1,2,3,4]).indexof(3) //2
Immutable.fromJS([1,2,3,4]).lastIndexof(3) //2
findIndex() 塘匣、 findLastIndex() Map不存在此方法
作用：查找滿足要求的元素的index值
用法：
Immutable.fromJS([1,2,3,4]).findIndex((value,index,array)=>{
return value%2 === 0;
}) // 1
Immutable.fromJS([1,2,3,4]).findLastIndex((value,index,array)=>{
return index%2 === 0;
}) // 3
find() 脓豪、 findLast()
作用：查找滿足條件的元素的value值
用法：
Immutable.fromJS([1,2,3,4]).find((value,index,array)=>{
return value%2 === 0;
}) // 2
Immutable.fromJS([1,2,3,4]).findLast((value,index,array)=>{
return value%2 === 0;
}) // 4
findKey() 、 findLastKey()
作用：查找滿足條件的元素的key值
用法：
Immutable.fromJS([1,2,3,4]).findKey((value,index,array)=>{
return value%2 === 0;
}) // 1
Immutable.fromJS([1,2,3,4]).findLastKey((value,index,array)=>{
return value%2 === 0;
}) // 3
findEntry() 忌卤、 findLastEntry()
作用：查找滿足條件的元素的鍵值對(duì) key:value
用法：
Immutable.fromJS([1,2,3,4]).findEntry((value,index,array)=>{
return value%2 === 0;
}) // [1,2]
Immutable.fromJS([1,2,3,4]).findLastEntry((value,index,array)=>{
return value%2 === 0;
}) // [3,4]
keyOf() lastKeyOf()
作用：查找某一個(gè)value對(duì)應(yīng)的key值
用法：
Immutable.fromJS([1,2,3,4]).keyOf(2) //1
Immutable.fromJS([1,2,3,4]).lastKeyOf(2) //1
max() 扫夜、 maxBy()
作用：查找最大值
用法:
Immutable.fromJS([1, 2, 3, 4]).max() //4
Immutable.fromJS([{a;1},{a:2},{a: 3},{a:4}]).maxBy((value,index,array)=>{
return value.get('a')
}) //{a:4}
min() 、 minBy()
作用：查找最小值
用法:
Immutable.fromJS([1, 2, 3, 4]).min() //1
Immutable.fromJS([{a;1},{a:2},{a: 3},{a:4}]).minBy((value,index,array)=>{
return value.get('a')
}) //{a:1}
創(chuàng)建子集
slice()
作用： 和原生js中數(shù)組的slice數(shù)組一樣驰徊，包含兩個(gè)參數(shù)笤闯，start和end，start代表開(kāi)始截取的位置棍厂，end代表結(jié)束的位置颗味，不包括第end的元素。若不包括end牺弹，則返回整個(gè)對(duì)象脱衙，若end為負(fù)數(shù)，則返回（start例驹，length-end）對(duì)應(yīng)的數(shù)據(jù)。若start只有一個(gè)并且為負(fù)數(shù)退唠，則返回最后的end個(gè)元素鹃锈。
用法：
Immutable.fromJS([1, 2, 3, 4]).slice(0); //[1,2,3,4]
Immutable.fromJS([1, 2, 3, 4]).slice(0,2); //[1,2]
Immutable.fromJS([1, 2, 3, 4]).slice(-2); //[3,4]
Immutable.fromJS([1, 2, 3, 4]).slice(0,-2); //[1,2]
rest()
作用：返回除第一個(gè)元素之外的所有元素
用法:
Immutable.fromJS([1, 2, 3, 4]).rest()//[2,3,4]
butLast()
作用：返回除最后一個(gè)元素之外的所有元素
用法:
Immutable.fromJS([1, 2, 3, 4]).rest()//[1,2,3]
skip()
作用：有一個(gè)參數(shù)n, 返回截掉前n個(gè)元素之后剩下的所有元素
用法:
Immutable.fromJS([1, 2, 3, 4]).skip(1)//[2,3,4]\
skipLast()
作用：有一個(gè)參數(shù)n, 返回截掉最后n個(gè)元素之后剩下的所有元素
用法:
Immutable.fromJS([1, 2, 3, 4]).skip(1)//[1,2,3]
skipWhile()
作用：返回從第一次返回false之后的所有元素
Immutable.fromJS([1, 2, 3, 4]).skipWhile(list.skipWhile((value,index,list)=>{
return value > 2;
}))// [1,2,3,4]
skipUntil()
作用：返回從第一次返回true之后的所有元素
Immutable.fromJS([1, 2, 3, 4]).skipUntil(list.skipWhile((value,index,list)=>{
return value > 2;
}))// [3,4]
take()
作用：有一個(gè)參數(shù)n, 返回前n個(gè)元素
用法：
Immutable.fromJS([1, 2, 3, 4]).take(2)//[1,2]
takeLast()
作用：有一個(gè)參數(shù)n, 返回最后n個(gè)元素
用法：
Immutable.fromJS([1, 2, 3, 4]).takeLast(2)//[3,4]
takeWhile()
作用：返回從第一次返回false之前的所有元素
Immutable.fromJS([1, 2, 3, 4]).skipWhile(list.takeWhile((value,index,list)=>{
return value > 2;
}))// []
takeUntil()
作用：返回從第一次返回true之前的所有元素
Immutable.fromJS([1, 2, 3, 4]).skipUntil(list.takeUntil((value,index,list)=>{
return value > 2;
}))// [1,2]
處理數(shù)據(jù)
reduce()
作用：和js中數(shù)組中的reduce相同,按索引升序的順序處理元素
用法：
Immutable.fromJS([1,2,3,4]).reduce((pre,next,index,arr)=>{
console.log(pre+next)
return pre+next;
})
// 3 6 10
reduceRight()
作用：和js中數(shù)組中的reduce相同,按索引降序的順序處理元素
用法：
Immutable.fromJS([1,2,3,4]).reduceRight((pre,next,index,arr)=>{
console.log(pre+next)
return pre+next;
})
// 7 9 10
every()
作用：判斷整個(gè)對(duì)象總中所有的元素是不是都滿足某一個(gè)條件，都滿足返回true瞧预，反之返回false屎债。
代碼：
Immutable.fromJS([1,2,3,4]).every((value,index,arr)=>{
return value > 2
}) // false
some()
作用：判斷整個(gè)對(duì)象總中所有的元素是不是存在滿足某一個(gè)條件的元素，若存在返回true垢油，反之返回false盆驹。
代碼：
Immutable.fromJS([1,2,3,4]).some((value,index,arr)=>{
return value > 2
}) // true
join()
作用：同js中數(shù)組的join方法。把準(zhǔn)換為字符串
用法：
Immutable.fromJS([1,2,3,4]).join(',') //1,2,3,4
isEmpty()
作用：判斷是否為空
用法:
Immutable.fromJS([]).isEmpty(); // true
Immutable.fromJS({}).isEmpty(); // true
count()
作用：返回元素個(gè)數(shù)滩愁，可自定義條件躯喇，返回滿足條件的個(gè)數(shù)
用法：
const list = Immutable.fromJS([1,2,3,4]);
const map = Immutable.fromJS({a:1,b:2,c:3,d:4});
list.count((value,index,list)=>{
return value > 2;
}) //2
map.count((value,index,list)=>{
return value > 2;
}) //2
countBy()
作用：與count不同的是，countBy返回一個(gè)對(duì)象
用法：
const list = Immutable.fromJS([1,2,3,4]);
const map = Immutable.fromJS({a:1,b:2,c:3,d:4});
list.countBy((value,index,list)=>{
return value > 2;
} //{false: 2, true: 2}
map.countBy((value,index,list)=>{
return value > 2;
} //{false: 2, true: 2}
