什么是 React？React.js 概念和术语概览
内容提要
React是一个用于构建用户界面的JavaScript库，特别适用于单页应用程序。它允许开发人员创建可重用的组件来管理本地状态和处理用户交互。React遵循单向数据流，数据从父组件流向子组件，有助于更好地管理数据和UI状态。React的关键术语和概念包括组件、JSX、Props、使用Key进行优化渲染、渲染和虚拟DOM、不可变状态、指令、React严格模式。
延伸解读
单向数据流如何简化状态管理
React 采用单向数据流，数据只能从父组件流向子组件。这种设计让数据流向清晰可预测，当 UI 出现问题时，开发者可以沿着组件树自上而下排查，而不必担心子组件意外修改了父组件的数据。同时，由于 Props 是只读的，子组件无法直接改动传入的数据，这进一步降低了状态管理的复杂度，尤其适合构建交互频繁的单页应用。
虚拟 DOM 与 Key：性能优化的两个关键点
虚拟 DOM 是实际 DOM 的轻量级副本，React 通过对比新旧虚拟 DOM（即 diffing）来找出最小变更集，只更新真正变化的部分，避免整页重绘。而在渲染列表时，Key 帮助 React 识别哪些元素被添加、修改或删除，从而更精准地复用已有节点。两者配合，能显著减少不必要的 DOM 操作，提升应用响应速度。
不可变状态：为什么不能直接修改 state
在 React 中，state 被视为不可变数据，不能直接修改。正确做法是复制现有状态并应用变更，再通过 setState 或 useState 的更新函数设置新状态。这样做的好处是，React 可以通过比较新旧状态的引用快速判断是否需要重新渲染，同时避免因直接修改导致的状态追踪失效。例如向数组添加元素时，应使用扩展运算符创建新数组，而不是 push 原数组。
严格模式与指令：开发辅助与执行环境控制
React 严格模式不会渲染任何 UI，但会在开发阶段激活额外的检查和警告，帮助提前发现潜在问题，且不影响生产代码。另一方面，'use client' 和 'use server' 这类指令常见于 Next.js 等扩展框架，用于标记组件在客户端还是服务端执行。两者分别服务于开发调试和执行环境划分，是 React 生态中值得留意的辅助机制。
Q&A
React是什么？
React是一个用于构建用户界面的JavaScript库，特别适用于单页应用程序。
React中的组件有什么作用？
组件是React应用程序的构建块，代表可以重复使用的自包含UI部分。
什么是JSX，它有什么用？
JSX是一种JavaScript的语法扩展，允许在JavaScript中编写类似HTML的代码，使得React更易于使用。
React是如何管理状态的？
在React中，状态是不可变的，不能直接修改，而是通过复制现有状态并设置新状态来更新。
什么是虚拟DOM，它的作用是什么？
虚拟DOM是实际DOM的轻量级副本，React使用它来提高性能，只更新变化的UI部分。
React严格模式有什么用？
React严格模式是一个工具，帮助在开发过程中检测潜在问题，激活额外的检查和警告。
