ES6 新增特徵整頓解說

新增敕令

1.let敕令

ES6新增了let敕令，用來聲明變量。它的用法相似於var，然則也存在新的特徵。

 - **let所聲明的變量，只在let敕令地點的代碼塊內有效。適用於for輪迴**
 

            var a = 3;
            var a = 4;
            
            let b = 4;
            
            {
                var a = 5;
                let b = 5;    //作用域僅在代碼塊內部
                let c = "this is inner c";
                var d = "this is inner d";
                console.log(b);    //b = 5
            }
          
            console.log(a);    //a = 5
            console.log(b);    //b = 4
            console.log(d);    //this is inner d
            console.log(c);    //c is not defined

for輪迴

    按理說，在實行完for輪迴后，應當開釋變量的值，不然能夠會對全局變量形成影響，因而，聲明為let，會更好。

            //運用var 聲明
            var result  = 0;
            for(var i = 0;i<100;i++){
                result += i;
            };
            console.log(result);    //5050
            console.log(i);    //101

            //運用let 聲明
            var result  = 0;
            for(let i = 0;i<100;i++){
                result += i;
            };
            console.log(result);    //5050
            console.log(i);    // i is not defined

 - **不存在變量提拔**

            //先操縱
            console.log('var變量提拔',a);    //undefined
            console.log('let沒有變量提拔',b);    //報錯：b is not defined
            //再聲明
            var a = 3;
            let b = 4;
           

 - **暫時性死區**

            var tmp = 123; 
            if (true) {
                tmp = 'abc'; // ReferenceError 
                let tmp; 
            } 

 - **不許可反覆聲明**
    ```
        var a = 3;
        var a = 4;
        
        let b = 4;
        let b = 5;     //TypeError:Duplicate declaration "b"
        console.log(a);//a = 4
        console.log(b);
    ```
    

2.const敕令

基礎用法：const聲明一個只讀常量。一旦聲明，常量的值就不能轉變。相似於Java中的final關鍵字。

      const PI = 3.1415; PI = 3; // TypeError: Assignment to constant variable

const聲明的變量不得轉變值，這意味着，const一旦聲明變量，就必需馬上初始化，不能留到今後賦值。

      const foo; // SyntaxError: Missing initializer in const declaration

其他特性與let一樣，具有不能反覆聲明，具有塊級作用域，暫時性死區。

解構賦值

ES6 許可根據肯定形式，從數組和對象中提取值，對變量舉行賦值，這被稱為解構（Destructuring）。比方：

let [a, b, c] = [1, 2, 3];

本質上，這類寫法屬於“形式婚配”，只需等號雙方的形式雷同，左側的變量就會被給予對應的值。假如解構不勝利，變量的值就即是undefined。另一種狀況是不完全解構，即等號左側的形式，只婚配一部分的等號右側的數組。這類狀況下，解構依舊能夠勝利。

1.對象的解構賦值

a>對象的屬性沒有序次，變量必需與屬性同名。

在ES5中

var obj ={
    name = "tom,
    age = 12,
};
var name = obj.name;
var age = obj.age;

在ES6中

let {name:name,age:age} = obj;
let{name,age} = obj;
console.log(name,age);

b>假如變量名與屬性名不一致，必需寫成下面如許。

    var { foo: baz } = { foo: 'aaa', bar: 'bbb' };     //baz = "aaa”

c>嵌套解構

let obj = { p: [ 'Hello', { y: 'World' } ] }; 
let { p: [x, { y }] } = obj;     //x = "Hello”; y = "World”

d>默認值（默認值見效的前提是，對象的屬性值嚴厲即是undefined）

var {x: y = 3} = {}; y // 3

2.數組的解構賦值

let [a, b, c] = [1, 2, 3];

a>不完全解構

let [a, [b], d] = [1, [2, 3], 4];    //a = 1; b = 2; d = 4 

b>鳩合解構

let [head, ...tail] = [1, 2, 3, 4];     //head = 1; tail = [2, 3, 4]

c>默認值（當婚配值嚴厲即是undefined時，默認值見效）

let [x, y = 'b'] = ['a'];     // x='a', y='b’

d>默認值也能夠為函數

function f() { console.log('aaa'); } 
let [x = f()] = [1]; 



let [a,b,...c] = ["terry","lerry","tom","jack"];
console.log(a);    //terry;
console.log(b);    //lerry;
console.log(c);    //["tom","jack"]

3.字符串的解構賦值
a>解構時，字符串被轉換成了一個相似數組的對象。

const [a, b, c, d, e] = ‘hello’;    //a=h;b=e;c=l;d=l;e=o

b>也能夠對數組的屬性解構

let {length : len} = ‘hello’;     //len = 5

c> 數值和布爾值解構賦值

解構時，假如等號右側是數值和布爾值，則會先轉為對象
let {toString: s} = 123;     //s === Number.prototype.toString true
let {toString: s} = true;     //s === Boolean.prototype.toString true

4.函數參數的解構賦值
基礎語法：

function add([x, y]){ return x + y; } 
add([1, 2]);

默認值：

function move({x = 0, y = 0} = {}) {
     return [x, y]; 
} 
move({x: 3, y: 8}); // [3, 8] 
move({x: 3}); // [3, 0] 
move({});     // [0, 0]
move();     // [0, 0]
    

解構賦值的罕見用處

1.交流變量的值

let x = 1; let y = 2; [x, y] = [y, x];

2.從函數返回多個值

function example() { return [1, 2, 3]; } 
let [a, b, c] = example();

3.函數參數的定義

function f([x, y, z]) { ... } 
f([1, 2, 3]);

4.提取JSON數據

let jsonData = { id: 42, status: "OK", data: [867, 5309] }; 
let { id, status, data: number } = jsonData;

5.輸入模塊的指定要領

const { SourceMapConsumer, SourceNode } = require("source-map");

6.函數參數的默認值

jQuery.ajax = function (url, { 
    async = true, cache = true, global = true, 
    beforeSend = function () {}, 
    complete = function () {},     
    // ... more config 
}) { // ... do stuff };

7..指定參數的默認值，就避免了在函數體內部再寫var foo = config.foo || ‘default foo’;如許的語句
遍歷map構造

var map = new Map(); 
map.set('first', 'hello'); 
map.set('second', 'world'); 
for (let [key, value] of map) { 
    console.log(key + " is " + value); 
}

——————————————————————–本次完畢————————-