关于javascript:Nodejs-Web开发第二章3

44次阅读

共计 4529 个字符,预计需要花费 12 分钟才能阅读完成。

电子书举荐

Become a ninja with Angular

Web Development with Node and Express, 2nd Edition

Building Server-side and Microservices with Go: Building Modern Backends and Microservices Using Go, Docker and Kubernetes

AI for Sports

Basic Linux Terminal Tips and Tricks: Learn to Work Quickly on the Command Line

Artificial Intelligence in Finance: A Python-Based Guide

Create Simple GUI Applications, with Python & Qt5

Distributed Tracing in Practice: Instrumenting, Analyzing, and Debugging Microservices
[
C Programming: Learn to Code](http://www.iebukes.com/c-prog…)

Effective Python: 90 Specific Ways to Write Better Python, 2nd Edition
[]()
[]()

应用 Babel 来应用实验性的 JavaScript 个性

Babel transpiler(转换器)是应用 JavaScript 最新性能或尝试新的 JavaScript 性能的当先工具。因为您可能 从未见过 transpiler 这个词,所以它的意思是将源代码从一种语言重写为另一种语言。它就像一个编译 器,Babel 将计算机源代码转换成另一种模式,但 Babel 生成的不是间接可执行的机器码,而 是 JavaScript。也就是说,它将 JavaScript 代码转换为 JavaScript 代码,在您意识到 Babel 的输入能够针对较 旧的 JavaScript 版本之前,JavaScript 代码仿佛没有什么用途。
更简略地说,能够将 Babel 配置将应用 ES2015、ES2016、ES2017(等等)性能的代码重写为合乎 ES5 版本 要求的 JavaScript 代码。因为 ES5 JavaScript 与旧计算机上的所有 web 浏览器都兼容,开发人员能够用现 代 JavaScript 编写前端代码,而后应用 Babel 将其转换为在旧浏览器上执行 ES5 JavaScript 代码。
要理解无关 Babel 的更多信息,请拜访 https://babeljs.io/。
Node Green 网站明确示意,Node.js 简直反对所有 ES2015、2016 和 2017 的性能。因而,实际上,咱们不 再须要在 Node.js 我的项目中应用 Babel。您可能须要反对较旧的 Node.js 版本,您能够应用 Babel 来实现这一 点。
对于 web 浏览器,须要很长时间来反对 ECMAScript 的最新帅能。这并不是说网络浏览器制造商在采纳新 性能方面停顿迟缓,因为谷歌、Mozilla 和微软团队都积极主动地采纳了最新的性能。可怜的是,苹果 的 Safari 团队在采纳新性能方面仿佛停顿迟缓。然而,更慢的是用户更新浏览器的速度。
因而,古代 JavaScript 程序员须要相熟 Babel。
咱们还没有筹备好展现这些个性的示例代码,然而咱们能够进一步理解 Babel 工具的设置。无关装置文档的更多
信息,请拜访 http://babeljs.io/docs/setup/ 而后单击 CLI 按钮。
为了简略介绍 Babel,咱们将应用它来转换咱们之前看到的在 Node.js 6.x 上运行的脚本。在这些脚本中,咱们应用了异步函数,这是 Node.js 6.x 不反对的个性。
在在命令框中关上 ls.js 和 ls2.js 的目录,输 λ 以下命令:

$ npm install babel-cli \ 
 babel-plugin-transform-es2015-modules-commonjs \ 
 babel-plugin-transform-async-to-generator

这几个命令将装置 Babel 软件以及几个转换插件。Babel 有一个插件零碎,您能够启用我的项目所需的转换 器。本例中咱们的次要指标是将后面显示的异步函数转换为生成器函数。生成器是 ES2015 引入的新函 数,为实现异步函数奠定了根底。
因为 Node.js 6.x 既没有 fs.promises 函数也没有 util.promisify 函数,因而咱们须要进行一些替换以创立一个 名为 ls2-old-school.js 的文件:

const fs = require('fs');
const fs_readdir = dir => {return new Promise((resolve, reject) => {fs.readdir(dir, (err, fileList) => {if (err) reject(err);
 else resolve(fileList);
 });
 });
};
async function listFiles() {
 try {
 let dir = '.';
 if (process.argv[2]) dir = process.argv[2]; 
 const files = await fs_readdir(dir);
 for (let fn of files) {console.log(fn);
 }
 } catch(err) {console.error(err); }
}
listFiles();

咱们有后面看到的雷同示例,但有一些更改。fs_readdir 函数创立一个 Promise 对象,而后调 用 fs.readdir,确保依据失去的后果回绝或解析 Promise。这或多或少就是 util.promisify 函数的作用。
因为 fs_readdir 返回一个承诺,wait 关键字能够做正确的事件,并期待申请胜利或失败。此代码应该
在 Node.js 版本上按原样运行,该版本反对异步函数。但咱们感兴趣的是,咱们之所以增加 fs_readdir 函 数,是因为它在较旧的 Node.js 版本上的工作形式。
fs_readdir 中应用的模式是在异步函数上下文中应用面向回调函数所需的模式。
接下来,创立一个名为.babelrc 的文件,其中蕴含以下内容:

{
 "plugins": [ 
 "transform-es2015-modules-commonjs", 
 "transform-async-to-generator"
 ]
}

该文件批示 Babel 应用咱们先前装置的命名转换插件。顾名思义,它将异步函数转换为生成器函数。因为咱们装置了 babel cli,因而装置了一个 babel 命令,以便咱们能够输出以下内容:

$ ./node_modules/.bin/babel -help

要转换代码,请运行以下命令:

$ ./node_modules/.bin/babel ls2-old-school.js -o ls2-babel.js

此命令传输命名文件,生成一个新文件 ls2-babel.js。新文件如下:

'use strict';
function _asyncToGenerator(fn) {return function ()
{var gen = fn.apply(this, arguments);
 return new Promise(function (resolve, reject)
{function step(key, arg) { try { var info =
 gen[key](arg); var value = info.value; } catch (error)
 {reject(error); return; } if (info.done) {resolve(value); 
 } else {return Promise.resolve(value).then(function (value) {step("next", value); }, 
function (err) { step("throw", 
 err); }); } } return step("next"); }); }; }
const fs = require('fs');
const fs_readdir = dir => {return new Promise((resolve, reject) => {fs.readdir(dir, (err, fileList) => {if (err) reject(err);
 else resolve(fileList);
  }); 
 });
};
_asyncToGenerator(function* () {
 var dir = '.';
 if (process.argv[2]) dir = process.argv[2]; 
 const files = yield fs_readdir(dir);
 for (let fn of files) {console.log(fn);
 }
})().catch(err => {console.error(err); 
});

这段代码对人类来说并不容易浏览。相同,这意味着编辑原始源文件,而后将其转换为指标 JavaScript 引 擎。须要留神的次要事项是,传输的代码应用生成器函数(示意函数 * 示意生成器函数)代替异步函数,并应用 yield 关键字代替 wait 关键字。生成器函数是什么以及 yield 关键字的确切作用并不重要;惟一须要 留神的是,yield 大抵相当于 wait,_asyncToGenerator 函数实现了相似于异步函数的性能。否则,传输的
代码相当洁净,看起来与原始代码十分类似。
传输的脚本按如下形式运行:

$ nvm use 4
Now using node v4.9.1 (npm v2.15.11)$ node --version v4.9.1
$ node ls2-babel
.babelrc
app.js
ls.js
ls2-babel.js
ls2-old-school.js
ls2.js
node_modules

换句话说,它与异步版本运行雷同,但在较旧的 Node.js 版本上运行。应用相似的过程,您能够转换应用 古代 ES2015(等等)构造编写的代码,以便它能够在旧的 web 浏览器中运行。
在本节中,咱们学习了 JavaScript 语言的提高,特地是异步函数,而后学习了如何在较旧的 Node.js 版本或 较旧的 web 浏览器中通过 Babel 来应用这些性能。

总结

在本章中,您学到了很多对于应用 Node.js 的命令行工具装置 Node.js 和运行 Node.js 服务器的常识。咱们还轻松地探讨了很多细节,本书稍后将介绍这些细节,所以请急躁期待。
具体地说,咱们介绍了下载和编译 Node.js 源代码、装置 Node.js 以在主目录中进行开发或在系统目录中进 行部署,以及装置 npm(Node.js 应用的事实上的规范包管理器)。咱们还理解了如何运行 Node.js 脚本 或 Node.js 服务器。而后,咱们查看了 ES2015、2016 和 2017 中的新性能。最初,咱们看了如何使 用 Babel 在代码中实现这些个性。
当初咱们曾经理解了如何设置开发环境,咱们筹备开始应用 Node.js 实现应用程序。第一步是学 习 Node.js 应用程序和模块的根本构建块,这意味着要更认真地理解 Node.js 模块,如何应用它们,以及如 何应用 npm 来管理应用程序依赖关系。咱们将在下一章中介绍所有这些。

正文完
 0