Skip to main content

React 概述

什么是 React​

React 是由 FaceBook研发的、 用于解决 UI 复杂度的开源 Javascript 库,只提供了 UI 层面的解决方案

遵循组件设计模式、声明式编程范式和函数式编程概念,以使前端应用程序更高效

使用虚拟 DOM 来有效地操作 DOM,遵循从高阶组件到低阶组件的单向数据流

帮助我们将界面成了各个独立的小块,每一个块就是组件,这些组件之间可以组合、嵌套,构成整体页面

React 类组件使用一个名为 render() 的方法或者函数组件 return,接收输入的数据并返回需要展示的内容

class HelloMessage extends React.Component {
render() {
return <div>Hello {this.props.name}</div>;
}
}

ReactDOM.render(
<HelloMessage name="Taylor" />,
document.getElementById("hello-example")
);

React 的特点​

  • 组件化: React 鼓励将 UI 划分为独立的、可复用的组件,方便管理和维护。

  • 虚拟 DOM: React 使用虚拟 DOM 来提高性能,通过比较新旧 DOM 树的差异,只更新需要更改的部分,减少了直接操作真实 DOM 的开销。

  • 单向数据流: 数据在 React 中是单向流动的,父组件通过 props 将数据传递给子组件,有助于维护数据的可预测性和一致性。

  • 声明式编程: React 提供了一种声明式的方式来描述 UI,使代码更易于理解和调试。

  • 生命周期方法: 组件具有生命周期,可以在不同阶段(如挂载、更新、卸载)执行特定操作,提供了灵活的控制。

  • 生态系统丰富: React 拥有强大的生态系统,包含许多库和工具(如 Redux、React Router 等),可以帮助处理状态管理、路由等功能。

  • 支持服务器端渲染: React 可以与 Node.js 等后端技术结合,进行服务器端渲染,提高页面加载速度和 SEO 性能。

  • 强大的社区支持: React 拥有庞大的开发者社区,提供丰富的学习资源和开源项目