constructor：

React 组件在创建时会调用该函数，初始化state、props等
此时不能调setState

render：

创建虚拟DOM
里面return一个虚拟DOM
<React.Fragment></React.Fragment>用于占位，可以简写成<></>
里面可以写if-else，问号冒号表达式，需要遍历数组的话用map来代替forEach
所有的循环都要有key

componentDidMount

组件挂载后（即插入DOM树后）立刻调用
首次渲染就会执行此函数
此时适合发起AJAX请求，
也可以在这里获取到页面上元素的宽高属性
可以通过id获取到页面元素，也可以通过如下ref获取到
React.createRef()

this.divRef = React.createRef()    //写在constructor里面，React.createRef()返回一个对象
<div ref={this.devRef}></div>   //写在return里
const div= this.divRef.current      // 获取到div
div.getBoundingClientRect()        // 获取到div的宽高，位置信息

componentDidUpdate：

会在组件更新后立刻调用
首次渲染不会执行此函数
当组件更新后，可以在此处对 DOM 进行操作。如果你对更新前后的 props 进行了比较，也可以选择在此处进行网络请求
如果要调用setState一定要包裹在条件语句里

componentDidWillUnmount：

组件将要被移除页面时调用
组件在unmount之后不可能在被mount，只有重新生成新组件再mount
在这里一般会取消监听，清除Timer，取消AJAX请求

shouldComponentUpdate：

shouldComponentUpdate(nextProps,nextState)
手动判断是否触发componentDidupdate()和render()

如果 shouldComponentUpdate() 返回值为 false，则不会调用 componentDidUpdate()和render()
可以根据应用场景灵活设置返回值，避免不必要的渲染。
最好使用React.PureComponent代替