react生命周期钩子函数

下面我从constructor构造函数开始，从参数、作用、用法各方面总结

首先react中class组件生命周期主要分为挂载、更新、错误边界、卸载四个阶段。
首先挂载阶段：
constructor
getDerviedStateFromProps
render
componentDidMount
然后是更新阶段：
getDerviedStateFromProps
shouldComponentUpdate
render
getSnapshotBeforeUpdate
componentDidUpdate
其次是错误边界：
getDerivedStateFromError
componentDidCatch
最后是卸载阶段：
componentWillUmMount

1、constructor

	constructor参数接受两个参数props，context
	可以获取到父组件传下来的props，context，如果你想在constructor构造函数内部使用props或者context，则需要传入，并传入super对象。如果你只需要在构造函数内使用props或者context，那么只传入一个参数即可。
	ES6的class constructor 和super
	只要组件存在constructor，就必须要写super，否则this指向会错误

2、getDerivedStateFromProps 组件将要挂载

	getDerivedStateFromProps 会在调用 render 方法之前调用，并且在初始挂载及后续更新时都会被调用。它应返回一个对象来更新 state，如果返回 null 则不更新任何内容。
	此方法无权访问组件实例。
	请注意，不管原因是什么，都会在每次渲染前触发此方法。

3、componentDidMount 组件渲染完成

	组件第一次渲染完成，此时的dom节点已经生成，可以在这里调用ajax请求，返回数据setState后组件会二次渲染

4、componentWillReceiveProps（nextProps）（即将废弃）

	componentWillReceiveProps在接受父组件改变后的props需要重新渲染组件时用到的比较多
	他接受一个参数 nextProps
	通过对比nextProps和this.props，将nextProps setState为当前组件的state，从而重新渲染组件

5、shouldComponentUpdate（nextProps，nextState）

	唯一用于控制组件重新渲染的生命周期，由于react中，setState以后，state发生变化，组件会进入重新渲染的流程，（暂时这么理解，有时候setState以后并不会重新渲染，比如数组引用不变）在这里return false可以阻止组件的更新
	因为react父组件的重新渲染会导致其所有子组件的重新渲染，这个时候其实我们是不要所有子组件都跟着重新渲染的，因此需要在子组件的该生命周期中做判断
	（对于初学者来说，用这个钩子函数比较少，如果注重性能优化，就会必须用到这个生命周期）

6、componentWillUpdate（nextProps，nextState）（即将废弃）

	shouldComponentUpdate返回true以后，组件进入重新渲染的流程，进入componentWillUpdate，这里同样可以拿到nextProps和nextState

7、render函数

	render函数会插入jsx生成的dom结构，react会生成一份虚拟dom树，在每一次组件更新时，在次react会通过其diff算法比较更新前后的新旧dom树，比较以后，找到最小的有差异的dom节点，并重新渲染
	react16中render函数允许返回一个数组，单个字符串等，不在只限制为一个顶级的dom节点，可以减少很多不必要的div（淡然注意升级你的react版本，将现有的项目升到react16并不会出现什么bug，卫衣注意的是proTypes类型检测换了名字）

8、getSnapshotBeforeUpdate(prevProps, prevState)

	getSnapshotBeforeUpdate() 在最近一次渲染输出（提交到 DOM 节点）之前调用。它使得组件能在发生更改之前从 DOM 中捕获一些信息（例如，滚动位置）。此生命周期的任何返回值将作为参数传递给 componentDidUpdate()。
	此用法并不常见，但它可能出现在 UI 处理中，如需要以特殊方式处理滚动位置的聊天线程等。

9、componentDidUpdate（prevProps，prevState）

	组件更新完毕后，react只会在第一次初始化成功会进入componentDidmount，之后每次重新渲染后都会进入这个生命周期，这里可以拿到prevProps和prevState，即更新前的props和state。

10、componentWillUnmount（）

	componentWillUnmount也是会经常用到的一个生命周期，初学者可能用到的比较少，但是用好这个很重要
	（a）clear你在组件中所有的setTimeout，setInterval
	（b）移出所有组件中的监听removeEventlistener

11、getDerivedStateFromError(error)

	此生命周期会在后代组件抛出错误后被调用。 它将抛出的错误作为参数，并返回一个值以更新 state。

12、componentDidCatch(error, info)

	此生命周期在后代组件抛出错误后被调用。 它接收两个参数：
			1.error --- 抛出的错误
			2.info --- 带有 componentStack key 的对象，其中包含有关组件引发错误的栈信息。
	componentDidCatch() 会在“提交”阶段被调用，因此允许执行副作用。 它应该用于记录错误之类的情况。

13、componentWillMount

	在挂载之前被调用。它在 render() 之前调用，因此在此方法中同步调用 setState() 不会触发额外渲染。通常，我们建议使用 constructor() 来初始化 state。
	此方法是服务端渲染唯一会调用的生命周期函数。