导致 setState (React) 异步的代码在哪里？答案

【问题标题】：Where is the code that causes setState (React) to be asynchronous?导致 setState (React) 异步的代码在哪里？
【发布时间】：2017-07-04 15:33:30
【问题描述】：

我最近通读了大部分 React 和 ReactDOM 代码库，以了解调用 setState 时会发生什么。在这一点上，我会说我在高层次上理解了事件的顺序。调用 setState 会导致将消息添加到需要处理的更新队列中。更新会得到处理，只有在必要时才会对 DOM 进行更改。

这就是我迷路的地方。有数百篇博客文章讨论了 setState 的异步行为。虽然我不怀疑 setState 是异步的，但我在 ReactDOM 代码库中找不到会引入异步行为的代码行。有谁知道具体发生在哪里？

【问题讨论】：

【解决方案1】：

首先setState 可能以异步方式执行，但并非总是这样执行。 Ben Nadel 在setState() State Mutation Operation May Be Synchronous In ReactJS

中列出了他的一些发现

总而言之，setStates 似乎在 react 可以拦截原始事件的情况下被批处理，例如 onClick 处理程序。由于 react 从虚拟 react DOM 创建实际 DOM（并且由于它知道属性的语义），它可以将您提供的任何 onClick 处理程序包装成类似这样的东西

wrappedHandler = () => {
  turnBatchingOn()
  originalHanlder()
  executeBatched()
}

在这种情况下，您将获得异步行为，所有 setState 调用都被排入队列，并且仅在您的原始 onClick 处理程序完成执行后才会执行。

请注意，这不是实际的反应代码，这只是我的猜测，它是如何实现异步效果的。我知道这不是实际的代码行，但我认为它可以帮助您找到它。

我在React Kung Fu上找到了解释 setState 实现的最佳文章

【讨论】：

【解决方案2】：

我认为 setState 不是异步的，但是对多个 setState 调用进行了优化，并且在某些情况下无法保证同步。

【讨论】：