JS中的Immutable

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

---

Immutable 优点

1. 与深拷贝相比，Immutable最大程度上共用了内存，这与深拷贝是有很大程度上的不同。
   共用内存：
   使用setIn去修改Immutable对象时，未被修改的节点依旧共享。

2. 适用于纯函数式编程。纯函数编程就是输入一样，输出必定一样。

3. 可以通过Immutable对象去判断是否要更新组件，这样可以提高性能，避免不必要的渲染。

Immutable.is(immutable1, immutable2);

若immutable1与immutable2内容相同，则返回true。否则返回false。
由此我们可以通过is去判断状态内容是否改变，决定是否重新渲染。

1. React 建议把 this.state 当作 Immutable 的，因此修改前需要做一个 deepCopy，显得麻烦。

let newState = Object.assign({}, state);

使用Immutable，使用update进行更新

this.state = Map({name: 'hi'});
this.setState({name: this,state.name.update('name', v=>'my')});

---

Immutable.fromJS是将Object和Array转化为Immutable Map和List。

---

Immutable对象的操作

• 获取immutable对象中的数组元素的某一下标元素。

data = fromJS({
    condition: ['one', 'two', 'three', 'four'];
});
// 获取'two'
data.getIn(['condition', 1]);

• 获取immutable数组中的数组大小

data = fromJS({
    condition: ['one', 'two', 'three', 'four'];
});

// 获取'two'
data.getIn(['condition']).size;