在 React 应用中，请问有哪些方式可以监听 state 的变化？请分别说明它们的使用场景和注意事项。
考察说明
考查对 React 状态变化监听机制的掌握，包括生命周期、hooks 及衍生状态的处理。
回答思路
- 【回答框架 1】React 中监听 state 变化的核心方式是使用 useEffect hook，它可以在组件渲染后执行副作用，通过依赖数组指定要监听的 state，当依赖变化时触发回调。setState 本身是异步批处理的，useEffect 能捕获更新后的值。
- 【回答框架 2】对于类组件，可以使用 componentDidUpdate 生命周期方法，通过比较前后 state 值来判断特定状态是否变化。但需手动对比，且初次渲染不会调用。
- 【回答框架 3】对于全局状态（如 Redux），可以用 useSelector 或 subscribe 监听 store 变化；在组件内则推荐使用 useMemo 或 useReducer 避免不必要的监听。
- 【回答框架 4】监听状态变化时需注意避免无限循环：不要在 useEffect 中直接修改被依赖的 state，而应通过事件或异步操作触发更新。
- 【回答框架 5】派生状态应优先通过计算得到（如直接计算渲染值），而不是通过监听再 setState，以减少重复渲染。
- 【关键点 1】useEffect 是函数组件监听 state 变化的首选方式，依赖数组控制触发时机。
- 【关键点 2】类组件用 componentDidUpdate 对比前后值实现监听。
- 【关键点 3】避免在监听回调中直接修改同一 state，防止循环渲染。
- 【关键点 4】优先使用派生状态，而非监听后 setState。