React组件生命周期

一.定义

生命周期函数指在某一时刻组件会自动调用执行的函数。

二.总体展示

三.详细说明

1.挂载阶段(Mount)：也就是把组件第一次在DOM树中渲染的过程。会依次调用如下函数：

constructor
组件类的构造函数，主要用途，初始化state和绑定成员函数的this环境。
render
组件的渲染函数，它是一个纯函数，完全根据this.state和this.props来决定返回的结果。render函数并不做实际的渲染动作，它只是返回一个JSX描述的结构，最终由react来操作渲染过程。并且，一个组件一定要实现render函数的定义，因为它的父类React.Component类对除render之外的生命周期函数都有默认实现。
componentWillMount和componentDidMount
这两个生命周期函数分别在render的前后调用，但是注意，render函数调用完成之后，componentDidMount函数并不会被立刻调用。需要等render函数返回的JSX渲染之后，组件真正的被装载到DOM树上，componentDidMount才会调用。

这两个函数还有一个很重要的区别，componentWillMount可以在服务器端被调用，也可以在浏览器端被调用。但是componentDidMount只能在浏览器端被调用。因此这个函数中是发起ajax请求获取数据的绝佳位置。

2.更新阶段(Update)：组件被重新渲染的过程。

当props或者state被修改的时候，就会引发组件的更新过程。

componentWillReceiveProps(nextProps)
调用方式：
(1)父组件传递的props发生改变。
(2)父组件的render函数被调用，在render函数里面被渲染的子组件就会经历更新过程，不管父组件传给子组件的props有没有改变，都会触发子组件的componentWillReceiveProps函数。
shouldComponentUpdate(nextProps, nextState)
这个函数可以译为：组件需要被更新吗？通常通过定制这个函数的实现方式，提高React组件的性能。
值得一提的是，通过this.setState函数引发的更新过程，并不是立刻更新组件的state值，在执行到shouldComponentUpdate函数的时候，this.state依然是this.setState函数执行之前的指。

3.卸载阶段(Unmount)

当React组件要从DOM树上删除掉之前，对应的componentWillUnmount函数就会被调用，所以这个函数适合做一些清理性的工作。

四.注意点

生命周期函数是针对组件而言的，也就是说每一个组件都可以有这么多的生命周期函数。