不可变数据

不可变数据

不可变数据是react推崇的

Immutable 实现的原理是Persistent Data Structure（持久化数据结构），也就是使用旧数据创建新数据时，要保证旧数据同时可用且不变。同时为了避免 deepCopy 把所有节点都复制一遍带来的性能损耗，Immutable 使用了（结构共享），即如果对象树中一个节点发生变化，只修改这个节点和受它影响的父节点，其它节点则进行共享。

这样避免了深拷贝造成的性能和空间浪费

Immutable.js 使用了Structure Sharing会尽量复用内存。没有被引用的对象会被垃圾回收。

通过将变化过程中的数据保存记录下来，就可以很容易实现Undo/Redo以及时间旅行的功能

// 使用 immutable.js
import Immutable from 'immutable';
foo = Immutable.fromJS({a: {b: 1}});
bar = foo.setIn(['a', 'b'], 2);   // 使用 setIn 赋值
console.log(foo.getIn(['a', 'b']));  // 使用 getIn 取值，打印 1
console.log(foo === bar);  //  打印 false

// 使用immer.js
// foo 原始对象，draftState是foo对象的副本，所有针对draftState的操作最终都会生成一个新的对象
produce(foo, draftState => {
  draftState.a.b = 2;
})

console.log(foo.a.b);  // 打印 2
console.log(foo === bar);  //  打印 false

根据API，我更喜欢immer.js