本文共 1821 字，大约阅读时间需要 6 分钟。
React 是 Facebook 内部开发的一个 JavaScript 类库，专注于构建用户与浏览器之间的交互界面。他引入了一种全新的方式来处理 DOM 的更新，即不需要专门去关注数据变化时需要重新渲染哪一部分 DOM。React 可以通过最小化的 DOM 修改实现整体应用的更新。
React 拥有以下独特的特点：
虚拟 DOM （Virtual DOM）：
React 把传统的 DOM 操作替换成由自己管理的虚拟 DOM。每次组件更新时，React 会生成新的虚拟 DOM snapshots，并对实际 DOM 进行最小化更新。单项数据流（单向数据绑定）：
React 采用单向数据流的设计，确保父组件的状态变化不会反向流到子组件，避免了大范围的状态爆炸。组件驱动发展：
React 鼓励将 UI 的每个功能模块独立封装成一个组件，便于管理和复用。声明式编程：
React 提供声明式的 API，使开发者可以通过简单的 JSX 就可以轻松构建复杂的 UI，再无需过多关注 DOM 的更新细节。JSX 是 React 组件内构建标签的一种 XML-style 语法，引入了 JavaScript 和 XML 的特点。虽然在不使用 JSX 的情况下 React 还能正常运行，但 JSX 可以显著提升代码的可读性和简洁性。
标签属性处理：
JSX 向后兼容普通 HTML 标签属性，但推荐使用驼峰形式命名法（如className 代替 class）。举例：<div className="container"></div> 与传统 HTML 的 <div class="container"></div> 有区别。动态值双引号处理：
JSX 允许将标签的属性值直接用 JavaScript 表达式，例如：<div id={uniqueId} className={dynamicClass}"></div>。逻辑操作：
JSX 不允许直接在标签内部使用逻辑判断（如if 或 else），但可以通过以下方式实现动态属性值： flag ? 'true' : 'false'注释方式：
JSX支持两种注释方式：///* */ 或使用 JSX 内联的注释方式：<div> {/* 这是一个注释 */ } </div>React 组件的生命周期分为以下几个阶段：
组件第一次被用于创建实例时，会依次调用以下生命周期方法：
getDefaultProps：初始化组件的默认属性。getInitialState：初始化状态（state）。componentWillMount：在组件第一次渲染之前调用，适用于一时间间隔内不允许修改状态的场景。render：生成虚拟 DOMSnapshot，默认返回 JSX 结构。componentDidMount：在组件首次渲染完成后调用，适用于访问真实 DOM 或与其它框架集成。用户开始与组件交互后，下列方法会依次被调用：
componentWillReceiveProps：组件接收到新的 props 时调用，适用于状态更新前。shouldComponentUpdate：决定是否需要重新渲染，返回 true 或 false。componentWillUpdate：在接收到新的 props 或 state 之前调用，适用于状态更新前的事务处理。render：生成新的虚拟 DOMSnapshot。componentDidUpdate：在组件更新完成后调用，适用于触发 DOM 涉及操作或响应状态变化。组件移除时，会调用以下方法：
componentWillUnmount：在组件被移除前调用，适用于释放资源或清理定时任务。转载地址：http://okvoz.baihongyu.com/