怎么理解React的state状态不可变？

Question

可不可以理解为像电池一样，不能修，只能换新的

Answer 1

你当然可以更改原来的对象而不是生成一个新的，只是官方不推荐你这样写罢了，因为React内部的代码是依赖这个不可变的约定来提高更新效率而已。这里时官方的解释：https://reactjs.org/docs/opti...。

简单来说就是如果你每次都是精准的替换新的对象，那么React的rerender计算可以更精准，规避没意义的对比；反之就是要递归遍历这个state，做更多的rerender计算，而实际上可能不需要更新DOM。

Answer 2

是这样的，原因是因为 react 更新是通过对比新旧 state 来进行的，所以不能直接修改当前 state，而是通过 setState 提交修改，最终合并成新的 state

Answer 3

React 的状态不可变本质上是引用不可变，因为对于 JavaScript 来说，对象是一种引用类型。在你 setState 后，React 会对新旧两个状态进行浅比较，因为 state 是引用类型，所以 React 会比较新旧 state 的引用，只有比较结果为 false，才会进行重新渲染。

所以说，你每次 setState 替换新的对象，其实质是替换对象的引用，让 React 感知到 state 的变化，React 才会进行重新渲染。