Traceur 使用方式

ES6于2015年6月正式发布,各大浏览器的最新版本对 ES6 的支持可以查看https://kangax.github.io/compat-table/es6/

目前各大浏览器和开发环境对支持ES6的支持情况参差不齐,在实际项目开发中,我们仍旧不得不降级使用ES5语法以兼容各平台。幸好有几款工具可以将ES6语法转换成ES5,让我们在使用ES6新特性编写代码的同时,不需要考虑具体的兼容性情况。

将ES6代码转换成ES5代码工具中最主流的有以下两个:

Traceur(Google研发); Babel

下面介绍这两个工具的使用方法,以及Node.js中对ES6的支持情况。

一. Traceur转换器

1)第一种方法:直接在页面中使用:

<!-- 加载Traceur编译器 -->
<script src="http://google.github.io/traceur-compiler/bin/traceur.js" type="text/javascript"></script>
<!-- 打开实验选项,否则有些特性可能编译不成功 -->
<script>
    traceur.options.experimental = true;
</script>

写ES6代码,用:

<script type="module">
    // ES6代码
</script>

注意,script标签的type属性的值是module,而不是text/javascript。这是Traceur编译器识别ES6代码的标识。

2) 第二种方法:Traceur的在线编辑器:

http://google.github.io/traceur-compiler/demo/repl.html

3) 第三种方法:使用node.js工具:

安装:

$ npm install -g traceur

直接运行ES6代码:

$ traceur calc.js

将ES6输出为ES5脚本:

$ traceur --script calc.es6.js --out calc.es5.js

为了防止有些特性编译不成功,最好加上–experimental选项。

$ traceur --script calc.es6.js --out calc.es5.js --experimental

二. Babel转换器

1) 安装:

$ npm install --global babel

2) 直接运行ES6脚本:

$ babel-node es6.js

3) 将ES6编译成ES5:

$ babel es6.js

-o 参数将转换后的代码,从标准输出导入文件:

$ babel es6.js -o es5.js

三. Node.js支持ES6的情况:

Google公司的V8引擎已经部署了ES6的部分特性。使用Node.js 0.11版,就可以体验这些特性。在 Node.js 使用的 JS 引擎 V8 里面将不同状态 ES6 特性分成了 3 个等级:

  • shipping (默认开启的特性)
  • staged (需要使用 –harmony 参数开启的特性)
  • in progress(不稳定或者未实现的特性, 不推荐使用)

Node v4.4.4版本对ES6的支持情况如下:

image_1ap049cqqj0ualnucjun91rfu9.png-43.8kB 【备注:上图转自http://www.alloyteam.com/2016/07/nodejs-native-support-of-the-es6-features/

在Node v4和 v5版本,可能需要运行node --harmony命令来打开所有已经部署的ES6功能。部分特性需要在严格模式下使用,即在文件中使用use strict

Node.js对ES6的具体支持情况可查看:

http://node.green/

参考:

JavaScript ECMA-262 规范:http://www.ecma-international.org/publications/standards/Ecma-262.htm

Node.js ES6 支持文档 https://nodejs.org/en/docs/es6/

ES6的各平台兼容性情况: https://kangax.github.io/compat-table/es6/

本文作者: 子匠_Zijor,转载自: http://www.dengzhr.com/node-js/832
  • 1
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值