如何在node中使用最新的ES6node.js语法教学

清除回答草稿
&&&您需要以后才能回答,未注册用户请先。使用 ES6 编写 Node 模块 - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
已注册用户请 &
PPA for Ubuntu
> ppa:chris-lea/node.js
使用 ES6 编写 Node 模块
22:30:17 +08:00 · 4311 次点击
最近因为接触 React Native 的原因,写了很多 ES6+,所以也顺便在给自己原有的项目做重构,写了一篇关于这个的小文章:
12 回复 &| &直到
13:47:23 +08:00
& & 09:41:41 +08:00
文章不错,学习了一把,谢谢分享。
我们前几天尝试了co的写法,有些小兴奋,还没有来得及重构自己的项目。
& & 10:23:43 +08:00
同学习下,虽然觉得ES6的新语法怪怪的
& & 10:56:05 +08:00 via Android
ECMA6给我的感觉就是越长越像Python了……
只希望新标准尽快实现吧,毕竟JavaScript用起来陷阱太多了。(&﹏&)
& & 12:02:34 +08:00
console error
GET
net::ERR_CONNECTION_RESET
embed.js:1
net::ERR_CONNECTION_TIMED_OUT
发现最上面的蓝色loading条是假的...?
下面早就 pending-&failed了
& & 12:35:24 +08:00
@ 是遇到了静态资源加载不出的问题吗?
& & 13:47:18 +08:00
用ES6很好就是多了个步compile step(说的后端,前端已经有了),目前看v8距离class支持还比较远,估计babel/traceur要延续相当久。
此外node/io上的require习惯存在已久,让开发者选择import vs require(其实是babel/traceur vs browserify/webpack),也有难度。
目前我还没回去重构我现有的开源代码,but maybe someday...
& & 13:50:46 +08:00
@ 嗯,编码习惯是比较难转变的,不过我觉得还是要走向与标准融合的大趋势。
另外用 import 的方式,前后端的模块加载规范也统一了,对自己的编码习惯养成来说也是个好处。
& & 16:16:07 +08:00
@ 现在加载出来了... 可以看到了 wwwww
& & 16:48:52 +08:00
@ import 前后端用babel和webpack是完全没难度的,只要简单的用babel将module编译成为amd的就好了。Typescript的` import xxx =
require('xxx')` 才是有难度的.....
& & 21:00:24 +08:00
nodejs没法用es6的吧?
需要和使用iojs?
& & 16:15:23 +08:00
只用到ES6的Generator...
其他可有可无的暂时先放放...
& & 13:47:23 +08:00
配合babel,轻松使用,已经在生产环境这么干了
& · & 2897 人在线 & 最高记录 3541 & · &
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.1 · 23ms · UTC 06:36 · PVG 14:36 · LAX 23:36 · JFK 02:36? Do have faith in what you're doing.Node中使用ES6语法的基础教程
转载 &更新时间:日 09:07:34 & 作者:深红
随着google和firfox以及node6.0对es6的支持,es6语法的定稿使它越来越受到关注,尤其是react项目基本上都是用es6来写的。下面这篇文章主要给大家介绍了关于Node中使用ES6语法的基础教程,需要的朋友可以参考下。
相关背景介绍
我们现在大多数人用的语法javascript 其实版本是ecmscript5,也是就es5。这个版本己经很多年了,且完美被各大浏览器所支持。所以很多学js的朋友可以一直分不清楚es5和javscript的关系。javascript是一门编程语言,那么它就会有版本,es5还是es6 就就是它的版本号。最新版es7己经在紧锣密布的进行中,它最新的语法会让我们写代码更新的行云流水。
Node本身已经支持部分ES6语法,但是import export,以及async await(Node 8 已经支持)等一些语法,我们还是无法使用。为了能使用这些新特性,我们就需要使用babel把ES6转成ES5语法
npm install babel-cli -g
&!-- more --&
babel的配置文件是.babelrc
"presets": []
新建一个demo文件夹,文件夹下新建 1.js
const arr = [1, 2, 3];
arr.map(item =& item + 1);
同时新建.babelrc配置文件
"presets": []
babel 1.js -o dist.js
可以看见,在文件夹下,新建了一个dist.js,这就是babel转码后的文件
但是,dist.js目前是没有任何变化的,因为我们在配置文件里面没有声明转码规则,所以babel无法转码
安装转码插件
npm install --save-dev babel-preset-es2015 babel-preset-stage-0
修改配置文件
"presets": [
es2015可以转码es2015的语法规则,stage-0可以转码ES7语法(比如async await)
再次运行终端
babel 1.js -o dist.js
可以看见,箭头函数被转码了
var arr = [1, 2, 3];
arr.map(function (item) {
return item + 1;
我们试下async await
async function start() {
const data = await test();
console.log(data);
function test() {
return new Promise((resolve, reject) =& {
resolve('ok');
转码后的文件
'use strict';
var start = function () {
var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
return regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
_context.next = 2;
return test();
data = _context.
console.log(data);
case 'end':
return _context.stop();
}, _callee, this);
return function start() {
return _ref.apply(this, arguments);
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. } catch (error) { reject(error); } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
function test() {
return new Promise(function (resolve, reject) {
resolve('ok');
再试下 import export
export default function say() {
console.log('2333');
import say from './util';
这次,要把1.js和util.js都转码,我们可以把整个文件夹转码
babel demo -d dist
新生成的dist文件夹下,就有转码后的文件。可以看见,转码后,仍然使用的是module.exportsCMD模块加载
babel-preset-env
上面的转码其实有个缺陷,就是babel会默认把所有的代码转成es5,这意味着,即使node支持let关键字,转码后,也会被转成var
我们可以使用babel-preset-env这个插件,它会自动检测当前node版本,只转码node不支持的语法,非常方便
npm install --save-dev babel-preset-env
"presets": [
"targets": {
"node": "current"
const a = 1;
babel 1.js -o dist.js
编译出来后
"use strict";
const a = 1;
可以看见,class和const并没有被转码,因为当前node版本(8.9.3)支持该语法
在实际项目中使用ES6语法
Koa2需要Node v7.6.0以上的版本来支持async语法,同时,我们也想在Koa2中使用import模块化写法
npm install --save-dev babel-register
npm install koa --save
新建一个文件夹app
export function getMessage() {
return new Promise((resolve, reject) =& {
resolve('Hello World!');
import Koa from 'koa';
import { getMessage } from './util'
const app = new Koa();
app.use(async ctx =& {
const data = await getMessage();
ctx.body =
app.listen(3000);
如果直接启动文件,肯定会报错
我们需要一个入口文件,来转码
require("babel-register");
require("./app.js");
node index
访问http://localhost:3000/可以看见页面了!
babel-register是实时转码的,所以实际发布时,应该先把整个app文件夹转码
babel app -d dist
这次,只要启动dist下的app.js即可
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对脚本之家的支持。
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具没有更多推荐了,
加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!用ES6来完成你的NodeJS应用原文链接:作者:Enogwe Victor译者:sunny转载需提前联系译者,未经允许不得转载ES2015或ES6是指JavaScript最新的稳定的迭代版本。ES6是JavaScript的重大更新,也是自2009年ES5标准化之后的第一次更新。这次更新包括了一些新的语言语法,其中有一部分被看做是语法糖。目前主流JavaScript引擎还没有完全实现这些新功能,需要进行一些转换才能在旧的JavaScript中使用这些新功能。在本教程中,我们将使用ES6创建一个应用。我们将会使用Babel编译器将ES6代码编译为ES5。用Babel编译器我们可以在Express应用中使用JavaScript的新特性。当然你也需要治疗JavaScript的基础知识才能够成功完成本教程中的内容。根据Babel的官网来看,我们可以用它来使用下一代JavaScript、本教程假设你已经安装了 Node Package Manager()和 。学习本教程的时候最好使用 linux 或者 mac Os 系统。当然,使用 windows 系统也可以正常进行。第一步:安装项目文件夹创建一个新的文件夹运行以下命令来初始化你的项目npm init -y
这将会帮你在你的项目中创建一个 package.json 文件。在这一步中,你的 package.json 文件应该与下面这个例子非常相似:{
"name": "es6express",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"author": "",
"license": "ISC"
第二步:创建程序入口在你项目的根目录下,创建 index.js 文件第三步:安装需要的模块(dependencies/devDependencies )在这一步中,我们将会安装 express 应用需要的模块。Dependencies注意这些依赖是可选的,只是因为我们创建 express 应用才需要。:一个快速的、无限制的、简约的 NodeJS web 框架:NodeJS 的 http 请求记录中间件要安装这些依赖,在你项目中间夹中打开 terminal,运行以下命令:npm install --save express morgan
在这一步,你的项目目录中应该会有一个 node_modules 文件夹,你的 package.json 文件应该与下面的这个例子类似:{
"name": "es6express",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.15.2",
"morgan": "^1.8.1"
Development Dependencies这些依赖是用于在我们项目中使用 babel 编译器的::使用 babel 命令行编译文件:Babel 为ES2015预设的插件:在 NodeJS 中使用 unix 命令 rm -rf在这一步,你的 package.json 文件应该与下面这个例子类似:{
"name": "es6express",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.15.2",
"morgan": "^1.8.1"
"devDependencies": {
"babel-cli": "^6.24.0",
"babel-preset-es2015": "^6.24.0",
"rimraf": "^2.6.1"
第四步:在你项目的根目录下创建一个 Babel 配置文件运行以下命令来创建一个 babel 配置文件touch .babelrc
这个文件是用来告诉 babel 如何转换你的 JavaScript 文件。我们将会把我们的ES6代码转换为ES5代码。打开你的 .babelrc文件,把以下代码段复制到你的文件中,并保存。{
"presets": ["es2015"]
第五步:使用 Babel 来编译我们的 JavaScript 文件我们要做的下一步就是使用 babel 把我们的 JavaScript 代码从ES6编译为ES5(我们现在还没有写什么 JavaScript 代码)。在你的 package.json 文件中,添加一个 start 和 build 命令。你的 package.json 文件应该与下面例子类似:{
"name": "es6express",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "rimraf dist/ && babel ./ --out-dir dist/ --ignore ./node_modules,./.babelrc,./package.json,./npm-debug.log --copy-files",
"start": "npm run build && node dist/index.js"
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.15.2",
"morgan": "^1.8.1",
"rimraf": "^2.6.1"
"devDependencies": {
"babel-cli": "^6.24.0",
"babel-preset-es2015": "^6.24.0"
恭喜你!你现在已经可以在你的 express 中使用 JavaScript 的新特性了。-------------------------------------------萌萌哒广告分割线-------------------------------------------------------- 码蜂社《Web突破班》开班倒计时最后一天啦,涵盖五大专题(JS高级、ES6/7语法、算法基础、Vue.js框架、NodeJS等),全程代码优先、项目驱动,现在报名优惠多多,详情请点击链接 。148 条评论分享收藏文章被以下专栏收录码蜂社前端专栏,大前端知识和资源、算法等计算机基础知识。欢迎来稿~(开小灶来这里:)

我要回帖

更多关于 node 语法 的文章

 

随机推荐