node中如何使用es6/7/8

這篇文章主要為大家展示了“node中如何使用es6/7/8”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“node中如何使用es6/7/8”這篇文章吧。

前言

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

分類

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

• shipping --- v8引擎可以支持的很好，默認(rèn)情況下我們是不需要設(shè)立任何的flag而可以直接運(yùn)行的。

• staged --- 這些是將要完成的新特性但是還不能被v8引擎所支持，需要使用 runtime flag： --harmony。

• in progress --- 這些特性是最好不要使用的，因?yàn)楹苡锌赡芪磥頃粡U棄，具有不確定性。

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

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

所以我們在node端寫es6語法時，大部分是可以直接使用的。但是對于es7/8的特性，目前還不能很好的支持。

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

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

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

性能　

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

塊級作用域

es5測試：

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)

多次測試，耗時分別為 11972/11736/11798

es6測試：

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)過多次測試， 耗時分別為 11583/11674/11521。

在這一方面使用es6語法略快。

class

es5語法

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)過測試，耗時分別為 2030/2062/1919ms。

es6語法：

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

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)過三輪測試，結(jié)果分別是 2044/2129/2080， 由此可見，兩者在速度上幾乎是沒有區(qū)別的。

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

map

es5語法：

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語法：

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)過幾輪測試，耗時分別為： 10458/10316/10319。 即es6的Map在運(yùn)行時間上是es5的10倍以上，所以在node環(huán)境下我們最好少使用Map語法。

模板字符串

es5語法：

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)過測試，可以發(fā)現(xiàn)時間分別為 2396/2372/2427

es6語法：

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)過測試，可以發(fā)現(xiàn)耗時分別為 2978/3022/3010。

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

箭頭函數(shù)

es5語法：

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)過測試，發(fā)現(xiàn)耗時分別為 1675/1639/1621。

es6語法：

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)過測試，發(fā)現(xiàn)耗時分別為 1596/1770/1597。

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

以上是“node中如何使用es6/7/8”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！