setState机制、源码以及回调用法

1.什么是setState？

state 的更改排入队列，并通知 React 使用更新后的 state 重新渲染此组件及其子组件，用于更新用户界面以响应事件处理器和处理服务器数据。

2.setState什么时候同步和异步？

• setState只在合成事件和钩子函数、生命周期函数中是“异步”的，在原生事件和setTimeout 中都是同步的
• setState很多时候并不是立即执行，所以在setState之后立即调用state可能不会得到理想的state的值。 componentDidUpdate或者 setState 的回调函数（setState(updater, callback)）这两种方式都可以保证在应用更新后触发
• setState 通过一个队列机制实现 state 更新。当执行 setState 时，会将需要更新的 state 合并后放入状态队列，而不会立刻更新 this.state，队列机制可以高效地批量更新 state

3.setState的源码

// 将新的 state 合并到状态更新队列中
var nextState = this._processPendingState(nextProps, nextContext); 
// 根据更新队列和 shouldComponentUpdate 的状态来判断是否需要更新组件
var shouldUpdate = 
 this._pendingForceUpdate || 
 !inst.shouldComponentUpdate || 
 inst.shouldComponentUpdate(nextProps, nextState, nextContext);
 

如果在 shouldComponentUpdate 或 componentWillUpdate 方法中调用 setState ，此时this._pendingStateQueue != null，则 performUpdateIfNecessary 方法就会调用updateComponent方法进行组件更新，但 updateComponent 方法又会调用shouldComponentUpdate 和 componentWillUpdate 方法，因此造成循环调用，使得浏览器内存占满后崩溃

import React,