前言

　　這幾年react、vue的快速發(fā)展，越來(lái)越多的前端開(kāi)始講es6的代碼運(yùn)用在項(xiàng)目中，因?yàn)槲覀兛梢酝ㄟ^(guò)babel進(jìn)行轉(zhuǎn)譯為低版本的js以便于運(yùn)行在所有瀏覽器中，import、export、let、箭頭函數(shù)等等，對(duì)于node端，當(dāng)然我們也希望使用這些高級(jí)語(yǔ)法，但是需要提前了解到node支持哪些新的語(yǔ)法。

?

分類

　　所有的es6特性被分成了三個(gè)階段/分類：

• shipping --- v8引擎可以支持的很好，默認(rèn)情況下我們是不需要設(shè)立任何的flag而可以直接運(yùn)行的。
• staged --- 這些是將要完成的新特性但是還不能被v8引擎所支持，需要使用 runtime flag： --harmony。
• in progress --- 這些特性是最好不要使用的，因?yàn)楹苡锌赡芪磥?lái)會(huì)被廢棄，具有不確定性。

　　

　　那么那些特性是nodejs版本默認(rèn)支持的呢？?

　　在網(wǎng)站 node.green 上，提供了非常棒的對(duì)于不同版本node對(duì)新特性的支持情況。

　　

　　

?

　　可以看到，我們常用的一些es6語(yǔ)法，node的支持已經(jīng)很好了，因?yàn)楫?dāng)前node的最新版本已經(jīng)是 6.11.2 了，這是推薦使用的版本，而最新的版本已經(jīng)達(dá)到了8.3.0 。

?

　　所以我們?cè)趎ode端寫(xiě)es6語(yǔ)法時(shí)，大部分是可以直接使用的。但是對(duì)于es7/8的特性，目前還不能很好的支持。

　

　　哪些特性是在開(kāi)發(fā)中呢？

　　新的特性在不斷地添加到v8引擎中去， 一般的說(shuō)， 還是期待他們到最新的v8引擎中的，盡管不知道是什么時(shí)候。?

　　你可以通過(guò)grepping來(lái)列出所有的in progress的特性，即使用 --v8-options 參數(shù)。 值得注意的是， 這些還是兼容性不好的特性，所有需要謹(jǐn)慎的使用他們。

?

?

性能　　

　　

　　es6是大勢(shì)所趨,我們不僅需要了解其特性的兼容性，還要早性能上做到心中有數(shù)，下面我們可以對(duì)es5和es6在node上跑來(lái)比較時(shí)間。

塊級(jí)作用域

es5測(cè)試：

var i = 0; var start = +new Date(),duration;while (i++ < 1000000000) {var a = 1;var b = '2';var c = true;var d = {};var e = []; }duration = +new Date() - start; console.log(duration)

多次測(cè)試，耗時(shí)分別為 11972/11736/11798

?

es6測(cè)試：

let i = 0; let start = +new Date(),duration;while (i++ < 1000000000) {const a = 1;const b = '2';const c = true;const d = {};const e = []; }duration = +new Date() - start; console.log(duration)

經(jīng)過(guò)多次測(cè)試， 耗時(shí)分別為 11583/11674/11521。?

在這一方面使用es6語(yǔ)法略快。

?

?

class

es5語(yǔ)法

var i = 0; var start = +new Date(),duration;function Foo() {;this.name = 'wayne' }Foo.prototype.getName = function () {return this.name; }var foo = {};while (i++ < 10000000) {foo[i] = new Foo();foo[i].getName(); }duration = +new Date() - start;console.log(duration)

經(jīng)過(guò)測(cè)試，耗時(shí)分別為 2030/2062/1919ms。?

?

es6語(yǔ)法：

注意： 因?yàn)槲覀冞@里只是測(cè)試class，所以兩者都是用var來(lái)聲明變量，即單一變量原則。

var i = 0; var start = +new Date(),duration;class Foo {constructor() {this.name = 'wayne' }getName () {return this.name;} }var foo = {};while (i++ < 10000000) {foo[i] = new Foo();foo[i].getName(); }duration = +new Date() - start;console.log(duration)

經(jīng)過(guò)三輪測(cè)試，結(jié)果分別是 2044/2129/2080， 由此可見(jiàn)，兩者在速度上幾乎是沒(méi)有區(qū)別的。

4.x的node版本在運(yùn)行es6代碼相比于es5代碼是非常慢的，但是現(xiàn)在使用node的6.11.2版本來(lái)運(yùn)行es6代碼和運(yùn)行es5代碼相比，兩者是一樣快的，可見(jiàn)node對(duì)于新特性的運(yùn)行速度得到了極大地改善。?

?

?

map

es5語(yǔ)法：

var i = 0; var start = +new Date(),duration;while (i++ < 100000000) {var map = {};map['key'] = 'value' }duration = +new Date() - start; console.log(duration)

運(yùn)行5次，結(jié)果分別為： 993/858/897/855/862

?

es6語(yǔ)法：

var i = 0; var start = +new Date(),duration;while (i++ < 100000000) {var map = new Map();map.set('key', 'value'); }duration = +new Date() - start; console.log(duration)

經(jīng)過(guò)幾輪測(cè)試，耗時(shí)分別為： 10458/10316/10319。 即es6的Map在運(yùn)行時(shí)間上是es5的10倍以上，所以在node環(huán)境下我們最好少使用Map語(yǔ)法。

?

模板字符串

es5語(yǔ)法：

var i = 0; var start = +new Date(),duration;var person = {name: 'wayne',age: 21,school: 'xjtu' }while (i++ < 100000000) {var str = 'Hello, I am ' + person.name + ', and I am ' + person.age + ' years old, I come from ' + person.school; }duration = +new Date() - start; console.log(duration)

經(jīng)過(guò)測(cè)試，可以發(fā)現(xiàn)時(shí)間分別為 2396/2372/2427

?

?

es6語(yǔ)法：

var i = 0; var start = +new Date(),duration;var person = {name: 'wayne',age: 21,school: 'xjtu' }while (i++ < 100000000) {var str = `Hello, I am ${person.name}, and I am ${person.age} years old, I come from ${person.school}`; }duration = +new Date() - start; console.log(duration)

經(jīng)過(guò)測(cè)試，可以發(fā)現(xiàn)耗時(shí)分別為 ?2978/3022/3010。

經(jīng)過(guò)計(jì)算，使用es6的語(yǔ)法耗時(shí)是es5語(yǔ)法的1.25倍左右。 因此，盡量減少在node端使用模板字符串，如果大量使用，顯然耗時(shí)是非常嚴(yán)重的。

?

?

箭頭函數(shù)

es5語(yǔ)法：

　

var i = 0; var start = +new Date(),duration;var func = {};while (i++ < 10000000) {func[i] = function (x) {return 10 + x;} }duration = +new Date() - start; console.log(duration)

經(jīng)過(guò)測(cè)試，發(fā)現(xiàn)耗時(shí)分別為 1675/1639/1621。

?

es6語(yǔ)法：

var i = 0; var start = +new Date(),duration;var func = {};while (i++ < 10000000) {func[i] = (x) => 10 + x }duration = +new Date() - start; console.log(duration)

經(jīng)過(guò)測(cè)試，發(fā)現(xiàn)耗時(shí)分別為 1596/1770/1597。?

即使用箭頭函數(shù)的運(yùn)行速度和使用es5方式的箭頭函數(shù)在運(yùn)行速度上是一致的，并且使用es6的箭頭函數(shù)寫(xiě)起來(lái)更加方便，所以推薦使用，我們可以直接使用。

?

?

?

總結(jié)

　　在node端使用es6還是不錯(cuò)的，對(duì)于常見(jiàn)的class、let、箭頭函數(shù)等等在速度上和es5不相上下，但是在寫(xiě)起來(lái)會(huì)更加方便，還是推薦使用的。

?

?

　　參考文章：?https://nodejs.org/en/docs/es6/

　　　　　　 　http://node.green/

轉(zhuǎn)載于:https://www.cnblogs.com/zhuzhenwei918/p/7344665.html

《新程序員》：云原生和全面數(shù)字化實(shí)踐50位技術(shù)專家共同創(chuàng)作，文字、視頻、音頻交互閱讀

總結(jié)

以上是生活随笔為你收集整理的node中使用es6/7/8 --- 支持性与性能的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。