上一篇讲述了 react生命周期的初始化，更新阶段，本篇接着上篇继续描述总结react生命周期的校徽阶段！
销毁阶段： 销毁阶段相对比较简单，在一次调和，更新中 如果发现元素被移除，就会对移除元素打上标签（Deleteion）后，在commit阶段会调用生命周期componentWillUnmount卸载组件以及DOM元素。
react-reconciler/src/ReactFiberCommitWork.new.js
const callComponentWillUnmountWithTimer = function(current, instance) {
instance.props = current.memoizedProps;
instance.state = current.memoizedState;
if (
enableProfilerTimer &&
enableProfilerCommitHooks &&
current.mode & ProfileMode
) {
try {
startLayoutEffectTimer();
instance.componentWillUnmount();
} finally {
recordLayoutEffectDuration(current);
}
} else {
instance.componentWillUnmount();
}
};
React在各个阶段的生命周期能做什么
1、constructor
在React不同的时期，抛出不同的生命周期钩子。
constructor（props）{
super(props); // 执行super， 传递props 才能在上下文中获取到props，
this.state={}; // 初始化state
}；
constructor的作用：
- 可以对类组件的事件做一些事件处理
- 初始化state
- 对类组件做一些必要的生命周期劫持，渲染劫持
2、getDerivedStateFromProps
getDerivedStateFromProps（nextProps, prevState）
getDerivedStateFromProps传递两个参数：
- nextProps：父组件新传递的props
- prevState：传入getDerivedStateFromProps生命周期，待合并的state
作用：getDerivedStateFromProps生命周期用于 初始化和更新阶段，接收父组件的props 并对其格式化，过滤等操作，返回值将作为新的state和合并到state中给视图渲染和使用。
只要组件更新，就会执行getDerivedStateFromProps，无论props，还是setState，或者forceUpdate。
3、componentWillReceiveProps/UNSAFE_componentWillReceiveProps
UNSAFE_componentWillReceiveProps函数执行是在组件更新阶段，UNSAFE_componentWillReceiveProps执行的驱动是父组件更新，带来的props被修改， 只要父组件触发render函数，调用createElement方法，props就会重新创建，componentWillReceiveProps生命周期就会被执行，所以即使props没改变，次生命周期也会执行。
作用：
- componentWillReceiveProps可以用来监听父组件是否更新render。
- componentWillReceiveProps可以接受props的改变，组件可以根据props的改变来决定是否更新state，可以在生命周期里访问到this，所以可以在异步成功回调改变state。
4、componentWillUpdate/UNSAFE_componentWillUpdate
该生命周期可以获取在更新之前，DOM还未更新，DOM所做的一系列操作。
5、render render是jsx元素通过createElement React Element对象的形式，一次render的过程，就是创建React.Element元素的过程。
作用： 可以在render里面做一些createElement创建元素，cloneElement克隆元素，react.children遍历children等操作。
6、getSnapshotBeforeUpdate
getSnapshotBeforeUpdate提供有两个参数：
- prevProps更新前的props
- preState 更新前的state
getSnapshotBeforeUpdate可以获取更新前的状态。
作用： getSnapshotBeforeUpdate生命周期的作用就是配合componentWillUpdate一起使用，通过计算形成一个“快照snapShot”，传递给componentDidUpdate，保存一次信息。
7、componentDidUpdate
componentDidUpdate提供三个参数分别是：prevProps， preState， snapShot， 这三个参数的作用分别为：获取更新前的props， 获取更新前的state，获取更新前的dom信息。
作用： 可以获取DOM的最新状态（componentDidUpdate执行时，DOM已经更新）。
8、componentDidMount
componentDidMount生命周期的执行和componentDidUpdate生命周期是在相同的时机， componentDidMount在初始化，componentDidUpdate在组件更新，此时DOM已经挂载，就可以基于DOM做一些操作。
作用：
- 基于DOM做一些操作。
- 请求接口，渲染视图。
9、shouldComponentUpdate
shouldComponentUpdate一般接收三个参数，newProps， newState nextContext， 分别是：新的props 新的state，新的context。
constructor（props）{
super(props); // 执行super， 传递props 才能在上下文中获取到props，
// 初始化state
this.state={
text:'text',
};
}；
shouldComponentUpdate(newProps, newState){
// 可以在此判断props和atate的变化 如果props/state中的text发生变化，组件渲染， 否则不渲染。
if(newProps.text !==props.text){
return true
}
if(newState.text !==this.state.text){
return true
}
return false;
}
作用： 可用于性能优化。
10、componentWillUnmount
组件销毁阶段唯一执行的生命周期。
作用：
- 对DOM的一些操作
- 请求接口（针对特定场景）。
