1.初探React生命周期

1:生命周期在不同状态下的执行顺序

• 当首次挂载组件时，按顺序执行 getDefaultProps、getInitialState、componentWillMount、 render 和 componentDidMount。
• 卸载组件时，执行 componentWillUnmount。
• 当重新挂载组件时，此时按顺序执行 getInitialState、componentWillMount、render 和
  componentDidMount，但并不执行 getDefaultProps。 当再次渲染组件时，组件接受到更新状态，此时按顺序执行 componentWillReceiveProps、shouldComponentUpdate、componentWillUpdate、render 和 componentDidUpdate。

当使用 ES6 classes 构建 React 组件时，static defaultProps = {} 其实就是调用内部的 getDe- faultProps 方法，constructor 中的 this.state = {} 其实就是调用内部的 getInitialState 方法。
生命周期的执行顺序如图所示。

2.mounting

在 componentWillMount 中调用 setState 方法，是不会触发 re-render的，而是会进行 state 合并，且 inst.state = this._processPendingState (inst.props, inst.context) 是在 componentWillMount 之后执行的，因此 componentWillMount 中 的 this.state 并不是最新的，在 render 中才可以获取更新后的 this.state。
因此，React 是利用更新队列 this._pendingStateQueue 以及更新状态 this._pendingReplace State 和 this._pendingForceUpdate 来实现 setState 的异步更新机制。
当渲染完成后，若存在 componentDidMount，则调用。这就解释了 componentWillMount 、render 、 componentDidMount 这三者之间的执行顺序。
其实，mountComponent 本质上是通过递归渲染内容的，由于递归的特性，父组件的 componentWillMount 在其子组件的 componentWillMount 之前调用，而父组件的 componentDidMount 在其子组件的 componentDidMount 之后调用。
mountComponent 的执行顺序所示

3.receive_props

   updateComponent 负责管理生命周期中的 componentWillReceiveProps、
shouldComponent-Update、 componentWillUpdate、render 和 componentDidUpdate。

   若存在 componentWillReceiveProps，则执行。如果此时在 componentWillReceiveProps 中调 用 setState，
是不会触发re-render 的，而是会进行 state 合并。且在 componentWillReceiveProps、 shouldComponentUpdate 和 
componentWillUpdate 中也还是无法获取到更新后的 this.state，即此 时访问的 this.state 仍然是未更新的数据，需要设
置 inst.state = nextState 后才可以，因此 只有在 render 和 componentDidUpdate 中才能获取到更新后的 this.state。

调用 shouldComponentUpdate 判断是否需要进行组件更新，如果存在 componentWillUpdate， 则执行。

updateComponent 本质上也是通过递归渲染内容的，由于递归的特性，父组件的 component- WillUpdate 是在其子组件 	
的 componentWillUpdate 之前调用的，而父组件的 componentDidUpdate 也是在其子组件的 componentDidUpdate 之
后调用的。

当渲染完成之后，若存在 componentDidUpdate，则触发，这就解释了 componentWillReceive- Props、
componentWillUpdate、 render、componentDidUpdate 它们之间的执行顺序。

禁止在 shouldComponentUpdate 和 componentWillUpdate 中调用 setState，这会造成循环 调用，直至耗光浏览器内存
后崩溃。

updateComponent 的执行顺序如图

4.unmounting

 unmountComponent 负责管理生命周期中的 componentWillUnmount。 如果存在 componentWillUnmount，
 则执行并重置所有相关参数、更新队列以及更新状态，如果现在componentWillUnmount 中调用 setState，
 是不会触发 re-render 的，这是因为所有更新 队列和更新状态都被重置为 null，并清除了公共类，完成了
 组件卸载操作。