本专栏致力于每周分享一个项目，如果本文对你有帮助的话，欢迎点赞或者关注☘️
React18 源码系列会随着学习 React 源码的实时进度而实时更新：约，两天一小改，五天一大改。
在React 18中，生命周期方法有所调整，React团队正在逐步引导开发者远离类组件，并且更加注重函数组件和Hooks的使用，带有UNSAFE_前缀的方法已被标记为不安全，并建议避免使用。
函数组件
- useEffect：组件渲染后执行副作用操作，如API调用或设置事件监听器；useEffect 是在 commit 阶段完成渲染后异步执行。可以通过传递空数组来模拟
componentDidMount、componentDidUpdatecomponentWillUnmount的行为，不过需要注意他们并不是属于同一抽象层次可以互相替代的概念。。 - useState：允许你在函数组件中拥有状态；每当状态更新时，组件将重新渲染。
- useContext：订阅Context的变化；当Context值变化时重新渲染。
- useReducer：用于有复杂状态逻辑的组件；当action触发时重新渲染。
- useCallback：返回一个memo化的回调函数；当依赖项改变时更新。
- useMemo：将函数结果memo化；当依赖项改变时重新计算。
- useRef：获得对DOM元素的引用，或用于保存任何可变值；在整个组件生命周期内保持不变。
- useImperativeHandle：自定义实例值，让父组件控制子组件；通常与
forwardRef一起使用。 - useLayoutEffect：与
useEffect类似，但在所有DOM更新前同步执行；用于需要同步更新DOM的操作。理解useEffect和useLayoutEffect的区别。 - useDebugValue：用于调试，显示hook的当前值；仅在开发模式下有效。
- useDeferredValue：用于处理某些状态的延迟更新，以优化性能和用户体验。
- startTransition： 允许将某些更新标记为低优先级，以提高页面的响应性能。
类组件
挂载阶段
- constructor：初始化state和绑定方法；在首次渲染之前调用，且只会调用一次。
- componentDidMount：组件已插入DOM树后立即调用；通常用于启动副作用，如网络请求。
- UNSAFE_componentWillMount：已废弃，不建议使用
更新阶段
- getDerivedStateFromProps：是一个静态方法，用于根据 props 的变化来更新组件的状态。在组件实例创建和更新阶段都会被调用。。
- shouldComponentUpdate：用于控制组件是否需要重新渲染。通过返回 true 或 false 来告诉 React 是否要更新组件，默认返回 true，返回
false则阻止后续生命周期的执行。如果不实现此方法，默认情况下组件总是重新渲染。 - UNSAFE_componentWillUpdate(nextProps, nextState) ：已废弃，不建议使用
- render：必须实现的方法，返回要渲染的JSX；每次渲染都会调用。
- getSnapshotBeforeUpdate：在 render 方法之后、在新渲染输出提交到DOM节点之前立即调用，用于获取更新前的 DOM 状态，，通常与 componentDidUpdate() 配合使用。
- componentDidUpdate：组件更新到DOM后立即调用；用于执行副作用，如网络请求或DOM操作。
卸载阶段
- componentWillUnmount：组件即将从DOM中卸载时调用；用于清理定时器、取消网络请求等。
错误处理
- static getDerivedStateFromError(error) ：
- 当子组件抛出错误时调用。
- 可以返回一个新的state，用于展示错误回退UI。
- componentDidCatch(error, errorInfo) ：
- 错误被捕获时调用。
- 可以用于日志记录错误信息。
- error 是错误对象，errorInfo 包含组件栈信息。
本专栏致力于每周分享一个项目，如果本文对你有帮助的话，欢迎点赞或者关注☘️
