面试官：“年轻人，我看你很懂setState原理，你来说说是同步还是异步的？”

这一次，我将带你一次性搞懂 React 中常见的 setState 原理。

setState 本身的默认行为

在进入主题之前，你肯定需要先学会 React 的基本使用。如果不会，请点赞离开；如果会用 React ，那就点赞收藏后离开(●'◡'●)。

我们在使用 React 的时候，经常会用到 state（一句废话），但是真正能完全搞清楚 setState 的帅哥美女，确实没几个。毕竟程序员都不太可能像我一样博学（和好看）。那么，要搞清楚它，应该去投胎（整容）吗？

不，你需要先搞清楚 setState 本身的默认行为。

其实也很简单，我们都知道，setState可以传递对象形式的状态，也可以传递函数形式的状态。而不论状态是对象形式还是函数形式，它都会先将所有状态保存起来，然后进行状态合并，所有状态合并完成后再进行一次性 DOM 更新。

如果状态是对象形式，后面的状态会直接覆盖前面的状态。类似于 Object.assign() 的合并操作。

对于对象状态这一点，我们有请翠花，上代码：

运行代码，Dom 中展示的结果为 1。很显然两次 setState 只有一次生效了。

真的吗？其实两次都有生效，只不过这两次 setState 在执行前，被合并成了一个。你不能说到底是那个生效，你可以说两个都没生效，因为最终执行的是被合并的那个代码。

如果状态是函数形式，那么依次调用函数进行状态累积，所有函数调用完成后, 得到最终状态，最终进行一次性 DOM 更新。

翠花，再来一段代码……

明显不一样的结果就能说明，两次都执行了，因为函数状态并不会合并，而是以此运行。

好了，翠花可以先下去休息了，前置只是我们已经梳理完了，那么，对于 setState 的研究就结束了吗？当然不是，接下