React是一个用于构建用户界面的库。它由Facebook的工程师创建,自其发布以来就在JavaScript社区掀起了热潮。过去几年中,它日益普及,成为很多团队和工程师构建动态用户界面的首选工具。实际上,React的API、思维模型和活跃的社区结合在一起,已经将React的开发带到了其他平台,包括移动端甚至虚拟现实。
探索React,看看它成为如此成功且有用的开源项目原因何在。第一部分将从头开始学习React的基础知识。由于构建健壮的JavaScript UI应用所涉及的工具可能非常复杂,我们将避免陷入这些工具之中,并专注于学习React API的方方面面。我们也会避免“魔法”,并致力于建立对React及其工作原理的具体理解。
React是一个用于构建跨平台用户界面的JavaScript库。React给予开发者强大的思维模型并帮助开发者以声明式和组件驱动的方式构建用户界面。这是React最宽泛和最简短的定义,我们将在本书中详细解释这些观点。
在广阔的Web工程领域中,React位于何处?React经常在Vue、Preact、Angular、Ember、Webpack、Redux以及其他知名JavaScript库和框架的相同领域中被谈及。React通常是前端应用的主要部分并且与我们刚刚提到的其他库和框架拥有类似的特性。事实上,相比以往,许多流行的前端技术现在都与React莫名地类似。曾几何时,React的做法是新颖的,而其他技术自那时就被React的组件驱动、声明式做法所影响。React持续保持“重新思考已建立的最佳实践”的精神,其主要目标是为开发人员提供一种富有表现力的思维模型和一种高性能的技术来构建UI应用。
是什么使得React的思维模型如此强大?这是因为它利用了计算机科学和软件工程技术的深层领域。React的思维模型广泛使用了函数式和面向对象编程的概念,并重点将组件作为构建的主要单元。React应用中,开发人员可以用组件创建用户界面。React的渲染系统管理着这些组件并保持着应用视图的同步。组件通常对应着用户界面的一个部分,如日期选择器、页头、导航等,但它们也可以负责客户端路由、数据格式化、样式以及客户端应用的其他职能。
React中的组件应该易于理解并很容易与其他React组件集成;它们遵循可预测的生命周期,能够维护自己的内部状态,并与“常规Javascript”兼容。我们将在本书的后续部分深入探讨这些理念,但目前我们可以先从较高层次来看看它们。图1-1给出了React应用的主要“成分”的概览。
React能够用组件创建用户界面。组件维护了自身的状态,使用“vanilla”JavaScript编写与运行,并从React继承了许多有用的接口。大部分React应用是为基于浏览器的环境编写的,但也可以用于iOS和Android这样的原生环境。关于React Native的更多信息,查阅Nader Dabit的React Native in Action,也可以从Manning出版社网站获取
React主要关注UI的视图方面。这意味着它并不是通过构建来完成更为全面的框架或库所要做的诸多工作。与Angular这样的框架进行一个快速比较可能有助于真正理解这一点。在最近的主要发布中,较之以前,Angular在概念和设计方面与React有了更多的共同点,但在其他方面,它涵盖了比React更大的领域。Angular包含了下列内置解决方案:
HTTP调用;
表单构建和验证;
路由;
字符串和数字格式化;
国际化;
依赖注入;
基本数据建模原语;
自定义测试框架(尽管这并不像其他领域那样是什么重要的区别);
默认包含的服务worker(一种用worker形式来执行JavaScript的方法)。