Node.js v6 With ES6

By 孫豪佑 at 20 Aug 2016

#news #消息 #Node.js #ES6

自從 Node.js v4 之後，逐漸支援 ES6 相關的規範。到了今年 Node.js 也已經更新到 v6 了，在 v6.4.0 這個版本，也支援了約 95% 的 ES6 規範。

甚至於 version 7 都已經準備要推出了(支援約 99% ES6 規範)，就讓我們來看看 Node.js v6 支援了哪些 ES6 好用的功能。

Node.js v6 With ES6

let

在 Node.js v5 不直接支援 let 宣告方式，但是 v6 已經全面支援了。

let 最主要就是作用域受到了規範，不會像以前使用 var 來宣告，一不小心就變成 global 變數，看以下例子會更為清楚。

以前的寫法

if(true) {
    var foo = 1;
    console.log(foo);    // 1
}

console.log(foo);        // 1

foo 已經變成全域變數了，為了避免這類的問題，因此採用 let 進行變數宣告會是比較好的習慣。

現在的寫法

if(true) {
    let foo = 1;
    console.log(foo);    // 1
}

console.log(foo);        // ReferenceError: foo is not defined

foo 這個變數被限制在 if 判斷式裡面。

從上面這個方法進行宣告之後，variable 範圍僅限於 if block 當中，在 if 外圍將無法呼叫 foo 這個變數，離開 if 範圍 foo 也就生命週期結束。

Default function parameters

在函式參數中可以設定預設值，沒有傳入參數則就會有預設值。

function add(a, b = 10) {
    console.log(a + b);
}

add(3);      // 13
add(3, 5);   // 8

Rest parameters

傳入的參數不用一個一個設定，也不用像以前這樣自己處理 arguments 物件。

以前的寫法

function foo() {
    console.log(arguments);
};

foo(1,2,3,4,5); // { '0': 1, '1': 2, '2': 3, '3': 4, '4': 5 }

現在的寫法

function foo(...args) {
    console.log(args);
}

foo(1,2,3,4,5);  // [1,2,3,4,5]

Spread operator

以前的寫法

function foo(a, b, c) {
    console.log(a + b + c);
}
var args = [0, 1, 2];
foo.apply(null, args);  // 3

現在的寫法

function foo(a, b, c) {
    console.log(a + b + c);
}
var args = [0, 1, 2];
foo(...args);  // 3

Destructuring

可以直接宣告一個陣列變數，找到陣列中相對應的值

var [a, b] = [1,2,3,4,5];
console.log(a); // 1
console.log(b); // 2

new.target

確認是調用函式，還是去 new 一個新的物件

function foo() {
    if (!new.target){
        return console.log('這不是 new 出來的物件');
    }
    console.log('我 new 出來了');
}

foo();         // 這不是 new 出來的物件
new foo();     // 我 new 出來了

Symbols

宣告某一個值是唯一不可重複

Symbol("foo") === Symbol("foo"); // false

Array.prototype.includes

用法跟 in 有點類似

in 的寫法

console.log(1 in [1,2,3,4,5]);  // true

includes 的寫法

console.log([1, 2, 3].includes(1)); // true

尚未支援但是好用的 ES6 功能

import

現在 import 一直處於爭議性的狀態，也沒辦法確認最後是否會支援這個語法與功能。

以前的寫法

var express = require('express');

var Router = require('express').Router;

現在的寫法

import express from 'express';

import { Router } from 'express';

async await

這種寫法可以不透過 callback 或是其他第三方套件來讓 code 變得更優雅，讓原本需要複雜 flow control 流程的 JavaScript ，變成一種 synchronize 模式。

讓開發者可以依照以往的開發模式進行，也讓程式碼閱讀流程簡潔許多。

以前的寫法

var request = require('request');

exports = function(req, res, next) {
    var foo;
    request('http://www.google.com', function(err, res, body) {
        if(err) {
            console.log(err);
        }
        foo = body;
        return res.send(foo);
    });
};

現在的寫法

import request from 'request';

exports = async function(req, res, next) {
    let foo = await request('http://www.google.com')
    return res.send(foo);
};