你对immutable有了解吗？它有什么作用？ about react

[careteenL]

• 1、Immutable实现的原理
  Immutable实现的原理是利用结构共享形成持久化数据结构，也就是使用旧数据创建新数据时，要保证旧数据同时可用且不变。同时为了避免 deepCopy 把所有节点都复制一遍带来的性能损耗，Immutable使用了结构共享，即如果对象树中一个节点发生变化，只修改这个节点和受它影响的父节点，其它节点则进行共享。
• 2、Immutable的优点
• （1）节约内存
  JavaScript 中的对象一般是可变的（Mutable），因为使用了引用赋值，新的对象简单的引用了原始对象，改变新的对象将影响到原始对象。为了解决这个问题，一般的做法是使用shallowCopy（浅拷贝）或 deepCopy（深拷贝）来避免被修改，但这样做造成了CPU和内存的浪费。Immutable 可以很好地解决这些问题。
• （2）Undo/Redo，Copy/Paste，时间轴等功能容易实现
  因为每次数据都是不一样的，只要把这些数据放到一个数组里储存起来，想回退到哪里就拿出对应数据即可，很容易开发出撤销重做这种功能。
• （3）并发安全
  Immutable Data一旦创建，就不能再被更改,也就不需要并发锁。
• 3、Immutable使用
• （1）与React搭配使用，Immutable简洁高效的判断数据是否变化，提高渲染速度及性能
• （2）与Redux/flux搭配使用

[careteenL]

• immutable是实现Immutable data的库，这个库有大量的api可以产生不可被修改的数据，对Immutable对象的任何修改或添加删除操作都会返回一个新的Immutable对象。其实现原理是持久化数据结构，相对于深拷贝而言，通过旧数据来创建新数据的时候，只修改发生变化的节点及其父节点，他们节点保持共享，性能更好，处理速度更快。
• 跟React配合使用能提高性能：一方面如果在state中保存了一份有深层结构的引用类型的数据，如果没有Immutable.js，则需要深拷贝一份再做修改(Object.assign及react中的setState都是属于浅拷贝)。而用Immutable.js将state中的数据包装一下，不需深拷贝就可以直接修改。另一方面由于修改后返回的是新对象，React.js只需要在oldState.obj === newState.obj这一层就能判断出obj产生了变化，不需要深入obj的深层结构。