useState 和 useEffect
原文英文，约1300词，阅读约需5分钟。
📝
内容提要
本文介绍了React的两个重要hooks：useState和useEffect。useState用于在函数组件中管理状态，返回当前状态和更新函数；useEffect用于处理副作用，如数据获取和DOM更新。使用时需注意依赖数组和避免条件调用，以防止错误和性能问题。
🔎
延伸解读
useState 的使用注意事项
在使用 useState 时，务必确保在函数组件的主体内调用，而不是在条件语句或嵌套函数中。这是因为 React 需要在每次渲染时以相同的顺序调用 hooks，避免出现错误。错误的使用方式可能导致组件无法正常工作。
useEffect 的依赖管理
使用 useEffect 时，依赖数组的管理至关重要。遗漏依赖可能导致副作用不按预期执行，甚至引发无限循环。确保在依赖数组中包含所有相关变量，以避免潜在的性能问题和逻辑错误。
清理副作用的重要性
在 useEffect 中设置的定时器或订阅需要在组件卸载时进行清理，以防止内存泄漏。未清理的定时器可能会导致对已卸载组件的状态更新警告，影响应用性能。
❓
Q&A
useState 的主要功能是什么？
useState 用于在函数组件中添加状态，返回当前状态和更新函数。
如何正确使用 useEffect？
useEffect 用于处理副作用，依赖数组控制副作用的运行时机，空数组时只在组件挂载时运行。
使用 useState 时常见的错误有哪些？
常见错误包括在条件块或嵌套函数中调用 useState，以及直接更新状态而不是使用 setState 函数。
useEffect 的依赖数组有什么作用？
依赖数组控制 useEffect 的运行时机，指定依赖时仅在依赖变化时运行，空数组时只在组件挂载时运行。
如何避免 useEffect 中的无限循环？
确保在 useEffect 中更新状态时正确设置依赖数组，以防止无限循环。
在面试中常见的关于 hooks 的问题有哪些？
常见问题包括 hooks 的定义、useEffect 的依赖数组影响及如何清理效果。
🏷️
