immutable不可变对象
immutable介绍
Facebook 工程师使用3年时间打造，与React同期出现，但是没有被默认放到React工具集中，它内部实现了一套完整的数据持久化 里面有很多常见的数据类型Collection List Map Set等
里面有三种重要的数据解构
Map： 键值对集合，对英语Object
Es6中也有专门的Map对象
List： 有序可以重复的列表，对应于Array
set： 无序并且不可重复key的数组
immutable原理
Immutable 实现的原理是（持久化数据结构），也就是使用旧数据创建新数据时，要保证旧数据同时可用且不变。同时为了避免深拷贝把所有节点都复制一遍带来的性能损耗，Immutable 使用了（结构共享），即如果对象树中一个节点发生变化，只修改这个节点和受它影响的父节点，其它节点则进行共享。
https://upload-images.jianshu.io/upload_images/2165169-cebb05bca02f1772 演示地址
immutable介绍
Immutable Data就是一但创建，就不能在被改变的数据，对于immutabe对象的任何修改或者添加删除操作都会返回一个新的immutable对象
为什么每次都要返回一个新的immutable对象呢？
因为redux中数据是只读的 如果任意一个使用的位置都可以直接修改redux中的数据 那么可能会影响其他位置引用的内容，造成现实错误
let {Map,List} = require("immutable")
let a=Map({name:"lijin",age:15,love:Map({c:Map({c2:"hahahh"}),lovename:"basketball",age:4})
})
let a1=Map({sex:"男",see:Map({show:"帅气"})
})let listArrb=List.of("a","b","f")
// console.log(listArrb.size)// const listArrc=listArrb.set(2,"刚改的")
// console.log(listArrc)// const listArrc=listArrb.set(12,"刚改的")
// console.log(listArrc)// const listArrc=listArrb.set(-2,"刚改的")
// const listArrd=listArrc.delete(1)// const liatArre=listArrb.insert(2,"刚修改")
// console.log(liatArre)const liatArre=listArrb.update(0,x=>x+"1")
console.log(liatArre)// console.log(listArrc)
// console.log(listArrd)// const listArr = List(["a","b","c"])
// console.log(listArr)// let b=a;
// console.log(b===a)//true
// let c=a.set("name","kobe");
// let d=a.deleteAll(["name"],["age"])// let g=a.toJS()// let e = a.clear()
// console.log(e)// let i = a.toArray()
// console.log(i)// let f =a.merge(a1).toJS()
// let h =a.merge(a1).toJSON()// console.log(f)
// console.log(h)// console.log(d.get("name"))
// console.log(c)
// console.log(c===a)
// console.log("c.name:"+c.get("name"))
##### Map
Map： 键值对集合。toJS把Map转换成原生的Object，深转换（无论有多少层级都会转换）toJSON/toObject把Map转换成原生的Object，浅转换（只转换第一层）toArray 转换成数组 浅转换##### List:有序可以重复的列表，对应于Array创建List两种方式：
let listArrb=List.of(“a”,“b”,“f”)
size获取list长度
// console.log(listArrb.size)set(下标，值)用于设置指定下标的值delect(下标)删除指定下标insert()用来更新指定下标的值update(下标,回掉函数)用于更新指定下标的值clear()清空并且返回一个空listpush pop unshift shift 和数组方法项功能相同setSize（）重新设置数组长度，小于原始list会被截取 ，大于会用undefined填充concat() 把多个list拼接成一个list
merge()是concat()别名## immutable在react中使用
##### immutable-react 简易购物车
a.jsx
import React, { Component } from 'react'
import B from "../components/b"
import {Map} from "immutable"
export default class a extends Component {constructor(){super()this.state={obj:Map({})}}add=()=>{let inpa=this.inpa.valuelet inpb=this.inpb.valuelet newobj=this.state.obj.set(inpa,inpb)this.setState({obj:newobj},()=>{console.log(this.state.obj)})this.inpa.value=""this.inpb.value=""}render() {return (<div>商品名： <input type="text" ref={(inputa)=>{this.inpa=inputa}}/><br></br>价格： <input type="text" ref={(inputb)=>{this.inpb=inputb}}/><br></br><button onClick={this.add}>添加</button>{this.state.obj.size==0?<p></p>:<B son_obj={this.state.obj.toJS()}></B>}</div>)}
}
b.jsx
import React, { Component } from 'react'export default class b extends Component {render() {let { son_obj } = this.propsreturn (<div>{ Object.keys(son_obj).map((v,i)=>{return(<p key={i}>商品名：{v}-----------商品价格：{son_obj[v]}</p>)})}</div>)}
}