React----immutable的使用
immutable：
Immutable Data 一旦创建，就不能再被更改的数据。对 Immutable 对象的任何增删改操作都会返回一个新的 Immutable 对象；实现的原理是 Persistent Data Structure（持久化数据结构），也就是使用旧数据创建新数据时，要保证旧数据同时可用且不变；同时为了避免 deepCopy 把所有节点都复制一遍带来的性能损耗，Immutable 使用了 Structural Sharing（结构共享），即如果对象树中一个节点发生变化，只修改这个节点和受它影响的父节点，其它节点则进行共享。
方法可以链式调用！
常用的有：
- Map：键值对集合，对应于 Object，ES6 也有专门的 Map 对象
- List：有序可重复的列表，对应于 Array
- Set：无序且不可重复的列表
Map、List（Map、List只能创建一层的immutable对象结构）
转换：
toObject() 转成原生js对象类型，只转一层 例如：map1. toObject()
toArray() 转成数组类型，只转一层 例如： list1.toArray()
深层次转换：耗性能，尽量少用！
toJS() 将immutable对象深层次转换成原生js的对象 例如：map1. toJS()
fromJS() 将原生的js对象obj深层次转换成immutable形式的对象 例如：fromJS(obj)
创建Map数据结构:
const map1 = immutable.fromJS({
a:1,
b:2,
c:3,
obj:{
name:"张三"
},
arr:[1,2,3,4,5]
})
创建list数据结构：
const list = immutable.List([1,2,3,4,5])
比较2个immutable对象是否相同：immutable.is(map1,map2)或者map1.equals(map2)
const map1 = immutable.Map({a:1,b:2})
const map2 = map1.update("a",(x)=>x = 10);
console.log(immutable.is(map1,map2)) //true
console.log(map1.equals(map2)) //true
console.log(map1==map2) //false
增set/setIn
const map2 = map1.set("d",100);
const map2 = map1.setIn(["d","age"],200)
删delete/deleteIn
const map2 = map1.delete("a");
const map2 = map1.deleteIn(["obj","name"])
改update/updateIn
const map2 = map1.update("a",(x)=>x = 200);
const map2 = map1.updateIn(["a"],(x)=>x = 200);
查get/getIn
const str = map1.get("a");
const str = map1.getIn(["a"]);
遍历map
map1.map((item,index)=>{
console.log(item)
})
list1.map((item,index)=>{
console.log(item)
})
过滤filter
map1.filter((key,val)=>{
return val == 1
}) //Map{a:1}
const list1 = immutable.List([1,2,3,["a","b"]]);
增set/setIn/push
const list2 = list1.push(100);
删delete/deleteIn/splice
const list2 = list1.splice(1,1);
删除Map中多个key值deleteAll([key1,key2]) (Map独有，List没有)
改splice
const list2 = list1.splice(2,1,"aaa");
查get/getIn
const list2 = list1.getIn([3,0]);
浅合并数据merge：新旧数据对比，不存在则增加，已存在则覆盖
const newlist = list1.merge(list2);
清除所有数据clear()
查看immutable对象长度 size / count()
console.log(newlist.size);
console.log(newlist.count());
判断一个数据结构是不是List/Map类型：List.isList() 和 Map.isMap()
List.isList([]); // false
List.isList(List()); // true
判断是否存在某一个key：has(key) 、 hasIn([key])
判断是否存在某一个value：includes(value)
注意：以上方法中，方法名未加In的都是单层查找，加了In可深层次向下继续查找！List操作：以下几个只适用于List
（1）前增unshift 后增push() 前删shift 后删pop() 插入insert(index,value) 设置长度 setSize(n) 查找下标对应值indexOf() 截取slice(first,end) 包含开始不包含结尾
（2）查找满足条件的元素的value值find() 、 findLast()
Immutable.fromJS([1,2,3,4]).find((value,index,array)=>{
return value%2 === 0;
}) // 2（3）查找满足要求的元素的index值findIndex() findLastIndex()
Immutable.fromJS([1,2,3,4]).findIndex((value,index,array)=>{
return value%2 === 0;
}) // 1
（4）跳过第n个 skip(n) 跳过第n个的后几个 skipLast()Immutable.fromJS([1, 2, 3, 4]).skip(1)//[2,3,4]
（5）返回前n个 take(n) 返回后n个 takeLast()
Immutable.fromJS([1, 2, 3, 4]).take(2)//[1,2]
（6）按索引升序 reduce() 降序 reduceRight()
Immutable.fromJS([1,2,3,4]).reduce((pre,next,index,arr)=>{ console.log(pre+next)
return pre+next;
}) // 3 6 10
