在具有许多组件的项目中,在销毁时释放组件所占用的资源非常重要，在React中每一个组件Component都有自己独立的状态,互相不受影响在浏览器中的状态有三种：
Mounting（挂载）
Update（更新）
Unmounted（卸载）
1.挂载
** constructor**
初始化方法定义 ** componentWillMount** 第一次渲染(render)前被加载一次，它也是一个放置初始化state值的好地方。 ** render rendercomponentDidMount** render阶段触发一次，ajax调用可以放到这里。每次渲染之后执行，获取dom的好地方，也可以setState，但是会额外触发一次render。2.更新
** componentWillReceiveProps(nextProps)**
这个生命周期涉及到父子组件传参的问题，组件正在接收新的props时，它将被调用。但是它不会在初次页面渲染（render）时被调用。 ** shouldComponentUpdate (nextProps, nextState)** 这个生命周期是用来做组件优化的，它返回的是布尔值，默认返回true。当一个新的props或者state正在被接收时，该钩子会在页面渲染（render）前被调用。它也不会在初次页面渲染（render）时被调用。组件接受新的state或者props时调用，我们可以设置在此对比前后两个props和state是否相同，如果相同则返回false阻止更新，因为相同的属性状态一定会生成相同的dom树，这样就不需要创造新的dom树和旧的dom树进行diff算法对比，节省大量性能，尤其是在dom结构复杂的时候。如返回false，将不会触发 componentWillUpdate()、render()、 componentDidUpdate() ** componentWillUpdate** 该钩子在shouldComponentUpdate()钩子之后（返回true），render()之前调用。不会在初次页面渲染（render）时被调用。该钩子的作用是为更新做准备。 ** render rendercomponentDidUpdate** 如果在这里setState，应设置前置条件，否则会陷入无限循环(深有体会)。组件更新之后调用立即刷新DOM不会在初次页面渲染（render）时被调用。3.卸载
** componentWillUnmount**
组件销毁之前调用一般用于清除定时器，卸载dom事件避免内存泄漏和一些无意义的操作。总结：React钩子函数执行顺序
参考文献
参考文章：
转载自 360质量效能