React Hooks 是什么？怎么实现的？

核心答案

**1. 是什么？**React Hooks 是 React 16.8 新增特性，让函数组件拥有类组件核心能力（状态管理、生命周期等），解决类组件逻辑复用复杂、生命周期逻辑混杂、this 指向难把控等问题。常用 Hooks 包括 useState、useEffect、useRef、useContext 等。

2. 实现原理本质是基于链表的状态管理机制，依赖 Fiber 架构：每个函数组件对应的 Fiber 节点有 memoizedState 属性存储 Hooks 链表；每个 Hook 是含 memoizedState（状态值）、queue（更新队列）、next（下一个 Hook）的对象；Hooks 需在组件顶层调用以保证链表遍历顺序稳定，首次渲染创建链表，更新时复用并更新链表数据。

延伸追问

• 1. Hooks 为什么不能在条件语句、循环中调用？——因 Hooks 依赖链表按调用顺序存储状态，顺序改变会导致链表遍历错位、状态错乱。

• 2. useState的更新是同步还是异步？——合成事件/生命周期中异步批量更新，定时器/原生事件中同步更新。

• 3. useEffect依赖数组的区别？如何避免闭包陷阱？——空数组仅挂载卸载执行，有值依赖变化执行，省略则每次渲染执行；闭包陷阱需补全依赖或用useRef存储可变值。

• 4. useRef和useState存储值的核心差异？——useRef存储值不触发重渲染且可变，useState更新触发重渲染且需通过setter修改。

• 5. 自定义Hook的命名规则和实现要点？——必须以use开头，内部可调用其他Hooks，核心用于复用状态逻辑。

（注：文档部分内容可能由 AI 生成）