关键特性

• 虚拟 DOM：React 引入了虚拟 DOM（Virtual DOM）的概念，它是真实 DOM 的抽象表示。虚拟 DOM 以 JavaScript 对象的形式存在，当数据发生变化时，React 会先在虚拟 DOM 上进行计算，找出最小的 DOM 更新量，然后再将这些变化批量更新到真实 DOM 上，从而提高渲染效率。
• 组件化开发：React 应用是由多个独立的组件组成的。组件是 React 应用的基本构建块，每个组件都有自己的职责和功能。组件可以嵌套使用，形成复杂的用户界面。这种组件化的开发方式使得代码更易于维护、复用和测试。
• 单向数据流：React 采用单向数据流的设计模式，数据的流动是单向的，这使得数据的流向更加清晰，易于理解和调试。当数据发生变化时，只会影响到依赖该数据的组件，而不会对其他组件产生意外的影响。
• JSX 语法：JSX 是一种 JavaScript 的语法扩展，它允许你在 JavaScript 代码中编写类似 HTML 的标记。JSX 使得代码更加直观和易于理解，同时也方便了组件的编写和组合。

优势

• 高效性能：虚拟 DOM 的使用使得 React 在处理大量数据和复杂界面时具有较高的性能。通过批量更新真实 DOM，减少了 DOM 操作的次数，从而提高了应用的响应速度。
• 易于维护和扩展：组件化的开发方式使得代码结构清晰，每个组件都有明确的职责，便于团队协作开发和后期的维护扩展。
• 丰富的生态系统：React 拥有庞大的生态系统，有许多第三方库和工具可供使用，如 React Router 用于实现路由功能，Redux 用于管理应用状态等。这些工具可以帮助开发者快速搭建功能强大的应用。
• 跨平台开发：借助 React Native，开发者可以使用 React 的语法和开发模式来构建原生移动应用，实现一次编写，多平台运行。

局限性

• 学习曲线较陡：对于初学者来说，React 的概念和技术栈（如 JSX、虚拟 DOM、状态管理等）可能比较难以理解和掌握。
• 需要额外的工具和库：为了实现完整的应用功能，通常需要引入一些额外的工具和库，如路由、状态管理等，这增加了项目的复杂度和配置成本。
• SEO 问题：由于 React 应用是基于 JavaScript 动态渲染的，搜索引擎爬虫在抓取页面时可能无法获取到完整的内容，从而影响网站的 SEO 效果。不过，可以通过服务器端渲染（SSR）或静态站点生成（SSG）等技术来解决这个问题。

示例代码

import React from 'react';
import ReactDOM from 'react-dom/client';

// 定义一个函数式组件
function HelloWorld() {
    return (
        <div>
            <h1>Hello, World!</h1>
        </div>
    );
}

// 创建根节点
const root = ReactDOM.createRoot(document.getElementById('root'));

// 将组件渲染到 DOM 中
root.render(<HelloWorld />);