react学习-生命周期函数

在开始react之前首先要了解的就是关于react执行的过程，那么，就让我们来了解了解react相关的生命周期函数。在这，将react的生命周期分为三个部分。

1.组件初始化

1.1 getDefaultProps()

设置默认的props值，getDefaultProps()方法被调用一次并缓存

1.2 getInitialState()

可直接在constructor中定义this.state，只调用一次，可以访问this.props

1.3 componentWillMount()

将要装载，在render之前调用，且整个生命周期只调用一次，此时可修改this.state，强调是在每一个组件render之前立即调用

1.4 render()

初始化的关键环节，此时创建虚拟DOM，并进行diff算法，重新渲染DOM树，此时不能修改this.state

1.4 componentDidMount()

还记得上面那个componentWillMount()将要装载吗？这里已经装载完成了，在render()之后调用，并且强调是在所有的子组件都render完之后才调用，常在这里建立定时器

2.组件更新

2.1 componentWillReceiveProps(newProps)

当组件需要接受新的props值时调用

2.2 shouldComponentUpdate(newProps, newState)

虚拟DOM的diff算法很重要的环节，返回值是一个布尔值，进行diff算法对比新旧两棵DOM树的props和state是否相同，若相同，则返回false，不需要更新，否则，更新

2.3 componentWillUpdate(newProps, newState)

在组件即将要更新props或state但还没有render时调用，此时可以修改this.state

2.4 render()

在重新渲染阶段的render根据更新的props和state值进行组件重新渲染

2.5 componentDidUpdate()

组件更新完成后调用，在render之后

3 组件销毁阶段

3.1 componentWillUnmount()

组件将要卸载调用，此时清除事件监听或者定时器或者一些不必要的变量等，防止内存泄漏