reactjs - Redux:为什么避免突变是使用它的基本部分？

Question

我是 Redux 新手 - 我真的很想了解使用函数式编程使单向数据更加优雅的总体情况。

我的看法是 - 每个reducer都采用旧状态，创建一个新状态而不改变旧状态，然后将新状态传递给下一个reducer以执行相同的操作。

我知道不造成副作用可以帮助我们获得单向数据流的好处。

我真的不明白不改变旧状态有什么重要。

我唯一能想到的可能是我读过的“时间旅行”，因为如果你坚持每一种状态，你就可以执行和“撤消”。

问题:

还有其他原因导致我们不想在每一步都改变旧状态吗？

Answer 1

如果处理得当，使用不可变数据结构可以对性能产生积极影响。就 React 而言，性能通常是为了在数据未更改的情况下避免不必要的应用程序重新渲染。

为此，您需要将应用的下一个状态与当前状态进行比较。如果状态不同:重新渲染。否则就不要这样做。

要比较状态，您需要比较状态中的对象是否相等。在普通的旧 JavaScript 对象中，您需要进行深度比较才能查看对象内的任何属性是否发生了变化。

对于不可变对象(immutable对象)，你不需要它。

immutableObject1 === immutableObject2

基本上就可以了。或者，如果您使用像 Immutable.js 这样的库 Immutable.is(obj1, obj2)。

就 React 而言，您可以将其用于 shouldComponentUpdate 方法，就像流行的 PureRenderMixin 所做的那样。

shouldComponentUpdate(nextProps, nextState) {
    return nextState !== this.state;
}

当状态没有改变时，此函数可以防止重新渲染。

我希望这有助于不可变对象(immutable对象)背后的推理。