前言
学习React，生命周期方法尤其重要，熟练使用生命周期方法可以大大提高组件的复用率，提高组件的性能。
生命周期图
生命周期阶段
有些人认为将初始化和挂载都归为初始化阶段。但是我们再详细一点，将初始化阶段拆分开来。
生命周期四个阶段：1.初始化 2.挂载 3.更新 4.销毁。
初始化
初始化阶段我们用到的最多的其实就是类的构造方法 constructor(props) super(props) 在构造方法中我们一般做的事情就是初始化某个状态，数据。
挂载
挂载顺序：componentWillMount() --> render() --> componentDidMount()
- componentWillMount()
该声明周期方法在组件挂载到DOM前调用，且只会被调用一次，这个方法正确调用的时候是在component第一次render之前, 所以第一眼看上去觉得就应该在这里去fetch datas. 但是这里有个问题, 在异步请求数据中这一次返回的是空数据, 因为是在 render 之前不会返回数据. 所以在渲染的时候没有办法等到数据到来,也不能在componentWillMount中返回一个Promise（因为Promise的特性之一就是状态不可变）。 - render()
react最重要的步骤，创建虚拟dom，进行diff算法，更新dom树都在此进行，此时不能修改state了 - componentDidMount()
该声明周期方法在组件挂载到DOM后调用，且只会被调用一次。在生产时,componentDidMount生命周期函数是最好的时间去请求数据，其中最重要原因：使用componentDidMount第一个好处就是这个一定是在组件初始化完成之后，再会请求数据，因此不会报什么警告或者错误，我们正常请教数据完成之后一般都会setState。
更新
- componentWillReceiveProps(nextProps)
组件初始化和挂载时不调用，组件接受新的props时调用 - shouldComponentUpdate(nextProps, nextState)
react性能优化非常重要的一环。组件接受新的state或者props时调用，我们可以设置在此对比前后两个props和state是否相同，如果相同则返回false阻止更新，因为相同的属性状态一定会生成相同的dom树，这样就不需要创造新的dom树和旧的dom树进行diff算法对比，节省大量性能，尤其是在dom结构复杂的时候 - componentWillUpdata(nextProps, nextState)
组件初始化时不调用，只有在组件将要更新时才调用，此时可以修改state - componentDidUpdate()
组件初始化时不调用，组件更新完成后调用，此时可以获取dom节点。
卸载
- componentWillUnmount()
组件将要卸载时调用，一些事件监听和定时器需要在此时清除，以免引起内存泄漏。