React中useEffect或事件处理器内连续useState setter执行顺序是否有保障？

在React的事件处理器、useEffect、同步代码块这类由React管控的执行上下文中，连续调用多个useState setter时，React会严格保证它们的执行顺序与调用顺序一致。

以你提供的代码为例：

const [one, setOne] = useState(0)
const [two, setTwo] = useState(0)

// 在事件处理器或useEffect内执行
setOne(1)
setTwo(1)

这里setOne(1)对应的状态更新逻辑会先于setTwo(1)被处理，最终one和two都会被更新为1，顺序不会被打乱。

需要补充的是：

• 这种顺序保证不受批量更新的影响——React会把多个setter调用合并为一次重新渲染，但更新逻辑的执行顺序依然严格遵循调用顺序。
• 在React 18及以后版本中，即使是在原生异步回调（如setTimeout、Promise.then）这类非React管控的上下文里，所有更新也会被默认批量处理，且setter的执行顺序同样会被保证。

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