ReactJS之生命周期方法

这些方法是嵌入到ReactJS组件生命周期内的钩子函数，可以在ES6类组件中使用，但是不能在无状态组件中使用。

先了解下constructor和render：

constructor：

会在组件实例化并插入DOM时才会调用，组件实例化过程被称为组件的挂载（mount）。

render：

会在组件实例化过程中或者在组件更新过程中被调用。当组件的state或者props变动时，render也会被调用。

组件挂载过程中4个钩子函数及执行顺序：

1. constructor()
   组件初始化时会被调用，在这个方法中你可以设置初始化状态及类方法的绑定。
2. componentWillMount()
   可以设置组件内部的状态，因为它不会触发组件的再次渲染，一般情况下都是在构造函数constructor中设置初始化状态。
3. render()
   必备，它返回作为组件输出的元素。它应该是一个纯函数，不应该在其中修改组件的状态，它把属性和状态作为输入并返回需要渲染的元素。
4. componentDidMount()
   仅在组件挂载后执行一次，异步请求获取数据是在这里进行的。

组件更新过程中的钩子函数及执行顺序：

1. componentWillReceiveProps(nextProps)
   新的属性会作为输入，可以使用this.props对比之前和之后的属性，根据结果去处理不同的业务，当然也可以根据新的属性去设置组件的状态。
2. shouldComponentUpdate(nextProps, nextState)
   每次组件因为状态或者属性更改时，该方法都会调用。可以用它来进行性能优化，用它来阻止不必要的渲染。
3. componentWillUpdate(nextProps, nextState)
   获取到下一个属性和状态，不能再触发setState()，如果想基于新的属性计算状态，必须利用componentWillReceiveProps(nextProps)。
4. render()
5. componentDidUpdate()
   在render之后立即调用，可以用来操作DOM或者发送异步请求

组件卸载过程中的钩子函数：

componentWillUnmount()
组件销毁前被调用，用来执行清理任务

组件出现错误时的钩子函数：

componentDidCatch(error, info)