电子书举荐
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 4Now using node v4.9.1 (npm v2.15.11)$ node --version v4.9.1$ node ls2-babel.babelrcapp.jsls.jsls2-babel.jsls2-old-school.jsls2.jsnode_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来管理应用程序依赖关系。咱们将在下一章中介绍所有这些。