2019-05-04 React 生命周期

vanillaJS例子
react生命周期例子

1.请求数据(ajax)
2.更新数据(setState)
3.事件监听(onclick)
4.初始化state

:初始化state放在construct里面
代码里可以setState的为:
onclick,
componentDidMount,
componentWillReceiveProps

---

生命周期面试题整理

1.react 生命周期函数(9个)
初始化阶段：
componentWillMount：组件即将被装载、渲染到页面上
render:组件在这里生成虚拟的 DOM 节点
componentDidMount:组件真正在被装载之后
construct
运行中状态：
componentWillReceiveProps:组件将要接收到属性的时候调用
shouldComponentUpdate:组件接受到新属性或者新状态的时候（可以返回 false，接收数据后不更新，阻止 render 调用，后面的函数不会被继续执行了）
componentWillUpdate:组件即将更新不能修改属性和状态
render:组件重新描绘
componentDidUpdate:组件已经更新
销毁阶段：
componentWillUnmount:组件即将销毁

2.shouldComponentUpdate 是做什么的，（react 性能优化是哪个周期函数？）

shouldComponentUpdate 这个方法用来判断是否需要调用 render 方法重新描绘 dom。因为 dom 的描绘非常消耗性能，如果我们能在 shouldComponentUpdate 方法中能够写出更优化的 dom diff 算法，可以极大的提高性能。

should为什么这么重要?
1should可以自定义是否更新组件
2通过should优化更新效率

3.在生命周期中的哪一步你应该发起 AJAX 请求？````
1用户点击时,2越早越好
放construct里和componentDidMount,
但是construct中不能使用setState.
原因是:Fiber有了调度render执行顺序的能力,所以componentWillMount方法的执行变得不确定

4.setState合并状态后的几个生命周期函数的调用顺序?(用户点击一个按钮,你调用setState时会更新哪几个钩子?)
shouldComponentUpdate -> componentWillUpdate -> render -> componentDidUpdate