????????今天写代码的时候，遇到了一个问题，该问题总结起来可以就是，一个函数组件中，有useLayoutEffect，有useEffect，useEffect中有卸载函数return，那么，在组件第一次加载的时候，useLayoutEffect、useEffect、useEffect.return的执行顺序是什么？组件更新的时候，执行顺序又是什么？
????????要弄清楚这个问题，需要去查阅官方文档，我们看看官方文档怎么说。
useLayoutEffect：
1.它会在所有的 DOM 变更之后同步调用 effect。可以使用它来读取 DOM 布局并同步触发重渲染。在浏览器执行绘制之前，
useLayoutEffect?内部的更新计划将被同步刷新。2.
useLayoutEffect?与?componentDidMount、componentDidUpdate?的调用阶段是一样的。? ? ? ??
由于 useLayoutEffect和componentDidMount的调用阶段是一样的，那么我们看看componentDidMount的调用阶段是什么：
componentDidMount()?会在组件挂载后（插入 DOM 树中）立即调用
因此，?componentDidMount会在DOM树构建完毕后调用（此时在页面上没有任何显示，只是在内存中构建了DOM树），那么useLayoutEffect也是在DOM树构建完毕后调用，因此在页面显示之前，useLayoutEffect就已经执行完毕了。
那么，再来看看useEffect的执行时期：
赋值给?
useEffect?的函数会在组件渲染到屏幕之后执行
因此，可以知道，在页面已经显示出该组件之后，才会执行?useEffect。
那么useEffect重的return函数什么时候执行呢？
为防止内存泄漏，清除函数会在组件卸载前执行。另外，如果组件多次渲染（通常如此），则在执行下一个 effect 之前，上一个 effect 就已被清除。
可以得到几个信息：
1.return在卸载组件和更新组件都会执行。
2.return在执行effect之前执行
因此，我们可以得出结论
组件第一次加载阶段：
1.先执行?useLayoutEffect
2.再执行useEffect
组件更新时：
1.先执行?useLayoutEffect
2.再执行useEffect.return
3.再执行useEffect
参考资料：react官方文档?
