微信号:FrontDev

介绍:分享 Web 前端相关的技术文章、工具资源、精选课程、热点资讯

Nodejs原生支持的ES6特性

2016-07-15 20:22 前端大全

(点击上方公众号,可快速关注)

原文:AlloyTeam

链接:http://www.alloyteam.com/2016/07/nodejs-native-support-of-the-es6-features/


随着React的风靡,配合Webpack以及Babel等技术,越来越多的前端同学将ECMAScript 2015(ES6)的特性运用在项目中,import、export、class、箭头函数、块级作用域等特性屡试不爽。而对于Node.js实现的后台代码来说,我们也同样希望使用这些ES6特性,下面将以v4.4.4(LTS version)长期支持版本为例展开话题,从兼容性以及性能两方面着手分析Node.js对ES6的支持情况。


兼容性


随着io.js的引入,新版的Node.js开始原生支持部分ES6的特性,既然ES6在浏览器端使用需要通过babel等编译,在Node.js总可以放心使用了吧,然而事实并非如此。


所有的ES6特性被划分为三个级别:


  1. shipping:已经分发并默认开启的特性;

  2. staged:已经分发,但需要使用 –harmony 参数开启的特性;

  3. in progress:开发中,还不稳定或者未实现的特性,不推荐使用;


Nodejs各个版本对ES6特性的兼容列表见:http://node.green/


【shipping】


ES6特性 Nodejs兼容性
let,const,块 strict模式支持
class类 strict模式支持
Map,Set 和 WeakMap,WeakSet 支持
generators 支持
进制转换 支持
对象字面量扩展 支持
promise 支持
String对象新API 支持
symbols 支持
字符串模板 支持


这些都是Node.js原生支持的特性,除了前两个特性需要在代码前面添加’use str

ict’。


【staged】


  • Symbol.toStringTag

  • Array.prototype.includes

  • Rest Parameters

  • ……


可通过node –v8-options | findstr harmony进行查看。在执行带有这些特性的js代码时,需要加上–harmony参数,例如:node –harmony app.js。


【in progress】


  • harmony_modules (enable “harmony modules”)

  • harmonyarrayincludes (enable “harmony Array.prototype.includes”)

  • harmony_regexps (enable “harmony regular expression extensions”)

  • harmonynewtarget (enable “harmony new.target”)

  • ……


可通过node –v8-options | findstr “in progress”进行查看。这些特性是那些将要支持(但具体时间未知)的特性,不建议使用。


Node.js 6.x 已经支持 93% 的ES6特性


从上面分析可以看到,Node.js 4.x版本对ES6特性的原生支持并不好,但是好消息是,Node.js 6.x LTS version将要发布了,带来了性能的大幅提升、更好的测试、更完善的文档、更好的安全性,并广泛支持了ES6。


在 Node.js 5.0 发布了6个月以后,6.0的时代马上就来了,目标是替换 4.x,计划在2016年10月成为下一个LTS version(长期支持的版本),5.0 只是一个过渡版本。考虑到产品的稳定性,建议大家目前还是继续使用 Node.js 4.x,直到10月份。


Node.js 6.x 的一项重要改进是使用了V8 5.0引擎,支持了93%以上的ES6,包括 destructuring、rest 参数、class和super关键字,ES6还没有被覆盖到的只剩下一小部分,包括 direct、mutual recursion、iterator closing 等。


让我们一起期待吧!


性能


ES6是大势所趋,尽管目前Node下使用ES6仍然存在很多问题,这里还是有必要对ES6的原生性能做一下对比测试,好让大家有个量化的概念。


环境描述:


CPU:Intel(R) Core(TM)i7-4790 CPU @ 3.60GHz


RAM:16.0GB


操作系统:64bit


node版本:v4.4.4


1.块级作用域


测试代码如下:


ES5:


var i = 0;

var start = +new Date(),

    duration;

while(i++ < 1000000){

    var a = 1;

    var b = '1';

    var c = true;

    var d = {};

    var e = [];

}

duration = +new Date() - start;

console.log(duration);


输出结果为45ms。


ES6:


'use strict'

let i = 0;

let start = +new Date(),

    duration;

while(i++ < 1000000){

    const a = 1;

    const b = '1';

    const c = true;

    const d = {};

    const e = [];

}

duration = +new Date() - start;

console.log(duration);


输出结果为29ms。


可见,使用let,const声明变量的速度比var快了约55%左右。


2.class


测试代码如下:


ES5:


var i = 0;

var start = +new Date(),

    duration;

function A(){

    this.name = '小强';

}

A.prototype.getName = function() {

    return this.name;

};

while(i++ < 100000){

    var a = new A();

    a.getName();

}

duration = +new Date() - start;

console.log(duration);


输出结果为2ms。


ES6:


'use strict'

let i = 0;

let start = +new Date(),

    duration;

class A{

    constructor() {

       this.name = '小强';

    }

    getName(){

        return this.name;

    }

}

while(i++ < 100000){

    const a = new A();

    a.getName();

}

duration = +new Date() - start;

console.log(duration);


输出结果为974ms。


可见,class没有丝毫优势,function真是快的不得了。


3.Map


测试代码如下:


ES5:


var i = 0;

var start = +new Date(),

    duration;

while(i++ < 1000000){

    var map = {};

    map['key'] = 'value';

}

duration = +new Date() - start;

console.log(duration);


输出结果为11ms。


ES6:


'use strict'

let i = 0;

let start = +new Date(),

    duration;

while(i++ < 1000000){

    let map = new Map();

    map.set('key','value');

}

duration = +new Date() - start;

console.log(duration);


输出结果为151ms。


建议如果不是必须情况,不要使用Map等复杂类型。


4.字符串模板


测试代码如下:


ES5:


var i = 0;

var start = +new Date(),

    duration;

var vars = {

    name: 'haha',

    address: 'tencent'

}

while(i++ < 1000000){

    var str = 'string text ' + vars.name + 'string '+ vars.address;

}

duration = +new Date() - start;

console.log(duration);


输出结果为8ms。


ES6:


'use strict'

let i = 0;

let start = +new Date(),

    duration;

let vars = {

    name: 'haha',

    address: 'tencent'

};

while(i++ < 1000000){

    let str = `string text ${vars.name} string ${vars.address}`;

}

duration = +new Date() - start;

console.log(duration);


输出结果为50ms。


字符串模板在执行时由于会首先找出其中的模板变量,所以性能也是大不如ES5的字符串拼接。


其他特性有兴趣的同学可以一一做测试。


总结


对于ES6来说,我们不仅要了解其特性的兼容性,也要从性能上做到心中有数,从上面的测试结果可以看到,大部分ES6新特性相对ES5原生方法要慢得多,但是我依然坚信,ES6是未来的趋势,随着Node版本的更新,相信这些兼容性以及性能问题在不久的将来都将迎刃而解。



【今日微信公号推荐↓】

更多推荐请看值得关注的技术和设计公众号


其中推荐了包括技术设计极客 和 IT相亲相关的热门公众号。技术涵盖:Python、Web前端、Java、安卓、iOS、PHP、C/C++、.NET、Linux、数据库、运维、大数据、算法、IT职场等。点击《值得关注的技术和设计公众号》,发现精彩!


 
前端大全 更多文章 Web开发的发展史 Web开发技术的演变 抛弃臃肿的 jQuery,用 NodeList.js 操作 DOM 静态网站生成器将是下一个大事件 来看看机智的前端童鞋怎么防盗
猜您喜欢 Java并发编程相关概念及注意事项 如何更好的提出技术问题 支持生产阻塞的线程池 Flink 原理与实现:Session Window 每天学一点之STF——WEB 端移动设备管理控制工具