React 进阶面试题, 为什么建议 React 中 setState 的第一个参数使用回调函数而不是一个对象?

Step 1

Q:: 为什么建议 React 中 setState 的第一个参数使用回调函数而不是一个对象？

A:: 在 React 中，使用 setState 时，如果依赖于先前的状态来计算新的状态，建议使用回调函数而不是直接传递一个对象。这是因为 setState 是异步的，多次调用 setState 可能会被批处理，导致先前的状态可能不是最新的状态。如果使用回调函数，React 会确保回调函数接收到的 prevState 是当前最新的状态，从而避免状态计算错误。

Step 2

Q:: React 中 setState 是同步还是异步的？

A:: 在 React 中，setState 通常是异步的，尤其是在合成事件处理程序和生命周期方法中。这是因为 React 可能会批处理多次状态更新，以优化性能。然而，在某些情况下，如原生事件或 setTimeout 中调用 setState，状态更新是同步的。

Step 3

Q:: React 是如何优化 setState 的性能的？

A:: React 通过批处理（batching）来优化 setState 的性能。它会在一个事件循环内收集所有的 setState 调用，然后一次性更新状态和重新渲染组件。这种方式减少了不必要的重渲染，从而提高了性能。

Step 4

Q:: setState 的回调函数和第二个参数有什么区别？

A:: 在 setState 中，传入的回调函数作为第一个参数，用于根据前一个状态计算新状态。而 setState 的第二个参数是一个可选的回调函数，在状态更新和组件重新渲染完成后执行，可以用于获取最新的 DOM 状态或触发其他副作用。