使用 WordPress 构建网络应用程序，第 2 版

第 9 章 JavaScript 框架和工作流 JavaScript 框架和工作流程

本作品已使用人工智能进行翻译。欢迎您提供反馈和意见：[e-mail]

JavaScript 是任何现代网络应用的主要组成部分。随着在服务器上运行 JavaScript 的Node.js 和强大的框架（如 React）的兴起，JavaScript 正迅速成为任何现代网络应用的主要组件。

2012 年，WordPress 3.6 版本中 PHP 与 JavaScript 代码的比例约为 6:7（PHP）和 1:7（JavaScript）。2018 年，在 WordPress 5.0 中引入新的块编辑器的 Gutenberg 插件 中，这两个数字颠倒过来，再加上 PHP 代码与 JavaScript 代码的比例仅为 1:9，而 JavaScript 则为 8:9。显然，区块编辑器是构建在服务器端 PHP 的基础上的，但 WordPress 中的大型新功能主要是由 JavaScript 构建的，这一点很能说明问题。随着块编辑器集成到 WordPress 仪表板的其他方面，预计 WordPress 核心中的 JavaScript 数量将会增加。

为什么要大举转向 JavaScript？在前端方面，使用 JavaScript 呈现网站要比使用 PHP 呈现网站轻便得多。在浏览典型网站时，加载所有 HTML DOM 是非常浪费的。网站的页眉、页脚、菜单和其他部分可能根本不会改变。有了 JavaScript，您只需加载网站的新部分，更改菜单项目的类，然后就可以看到：新页面。这样的体验更像应用程序，非常适合在带宽比较稀缺的移动网络上使用网络应用程序。

备注

使用 Ajax 更新页面而不是加载新页面有时被称为构建单页面应用程序 (SPA)。

在深入了解 JavaScript 的世界之前，我们觉得有必要表达一下编写本章并保持更新的难度。通常所说的 JavaScript 编程语言和平台是标准、框架和工具的复杂集合。

从技术上讲，每个独立的浏览器都有自己的 JavaScript 版本，对不同功能的支持也各不相同。浏览器供应商与其他利益相关者一起，在 Ecma 国际技术委员会第 39 号（TC39）上发布 JavaScript 标准。该标准实际上叫做 ECMAScript，JavaScript 只是它的一种实现方式。¹ECMAScript 的最新版本是 ECMAScript2018（或 ES2018 或 ES9），但 "现代 JavaScript "通常被称为 ES6。这一版本的 ECMAScript 发布于 2015 年；ES6 是第一个包含 JavaScript 开发人员为之兴奋的许多新功能的版本。

还不明白吗？我们真的很想抛开这些废话，用尽可能简单明了的方式来解释 JavaScript，但你在尝试创建应用程序时会遇到其中的一些术语，我们希望你至少能认识它们。

在本章中，我们将定义你在为WordPress编写JavaScript时会遇到的一些最常用的术语和工具。然后，我们将深入探讨我们和其他WordPress开发人员在过去几年中一直在使用的具体方法。最后，我们将探讨在WordPress社区中流行的一些较新的JavaScript框架和工作流程。

备注

在本章和全书中使用的术语 "JavaScript"，，是指以任何版本的JavaScript编写的、在客户端浏览器中运行的任何代码，包括jQuery和在jQuery中完成的Ajax调用。