React中是否仅在状态与初始值不同时重置？性能影响分析

结论：绝大多数场景下，两种写法的性能差异可以忽略不计，甚至无条件调用setError('')的写法更实用

为什么性能差异可以忽略？ #

• React内部会自动做状态对比：当你调用useState的更新函数时，React会先对新状态和当前状态做浅比较。如果值相等（比如当前error已经是空字符串，你再次调用setError('')），React会直接跳过重渲染流程，不会触发组件更新。这意味着所谓的“重复赋值”根本不会走到渲染环节，几乎没有额外开销。
• 条件判断本身也有开销：if (error)这个判断需要读取当前状态值、执行布尔判断，虽然消耗极小，但和React内部的浅比较开销比起来，并没有明显优势。在高频触发的场景中，两者的性能差距可以说是微乎其微。

为什么更推荐无条件重置？ #

• 代码更简洁：少了分支逻辑，可读性更高，后续维护时不容易出错。比如如果哪天error的初始值改成null或者undefined，原来的if (error)判断可能就失效了，而无条件重置的写法不需要调整。
• 避免逻辑遗漏：有些场景下，error可能是在其他地方被设置的，你很难保证每次调用handleSubmit时都能准确判断error的当前状态，无条件重置能确保状态被正确清空。

特殊情况说明 #

如果你的状态是复杂类型（比如对象、数组），React的浅比较可能会误判（比如引用地址变了但内容没变），这时候无条件更新可能会触发不必要的重渲染。但你的示例中是字符串这种基本类型，完全不存在这个问题。如果是复杂类型，确实需要先做深比较再决定是否更新，但这属于特殊场景的优化，和当前的字符串状态重置无关。

总结 #

日常开发中，优先选择无条件重置状态的写法即可，除非你能明确证明这个状态更新的开销已经成为性能瓶颈（这种情况极其罕见）。

内容的提问来源于stack exchange，提问作者JackFrost