为什么要用不可变数据呢

来源：5-5 state特点-不可变数据-非常重要的概念

入门级全栈专家

2023-03-24

写回答

3回答

慕粉3946981

2023-05-09

这个函数式组件内部做了优化，发现你修改的 state 对象和原来对象引用一致，是不会重新将组件渲染到DOM中的。

慕粉3946981

2023-05-09

这其实是 react 的一个概念。 react 在早些版本的时候是用类组件，那个时候还没有 hook 这个东西。当前类组件提供了一个生命周期钩子函数叫做 shouldComponentUpdate，这个函数是用来做组件优化的，返回 true 则需要重新将组件渲染到 DOM中，返回 false 则不需要将组件渲染到 DOM 中，而这个 shouldComponentUpdate 会自动注入2个参数，一个是 nextProps 一个是 nextState，这两个参数分为就是组件更新后的 props 和 state，然后你可以通过 this.state 拿到当前组件中的state和 nextState 做比较，如果说里面的 key/value 都一致那么就不需要将组件渲染成DOM (在不考虑 props 情况下优化的思路)。后面 react 就发明了这个概念，如果说是state里面的值是一个对象，直接修改对象里面的 key，那么在 shouldComponentUpdate这个函数的参数中 nextState 和当前组件中的 this.state 是一样的(对象引用地址相同)，那么无法优化组件。react 就说 this.state 中的都是不可变数据，需要修改直接新创建一个对象把 this.state 中的对象地址给覆盖掉，那么 shouldComponentUpdate 就能正常工作。