ES6回顧

變量

1.一、let和var

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6
複製代碼

上面代碼中，變量i是var命令聲明的，在全局範圍內都有效，因此全局只有一個變量i。每一次循環，變量i的值都會發生改變，而循環內被賦給數組a的函數內部的console.log(i)，裏面的i指向的就是全局的i。也就是說，全部數組a的成員裏面的i，指向的都是同一個i，致使運行時輸出的是最後一輪的i的值，也就是 10。
若是使用let，聲明的變量僅在塊級做用域內有效，變量i是let聲明的，當前的i只在本輪循環有效，因此每一次循環的i其實都是一個新的變量，因此最後輸出的是6。你可能會問，若是每一輪循環的變量i都是從新聲明的，那它怎麼知道上一輪循環的值，從而計算出本輪循環的值？這是由於 JavaScript 引擎內部會記住上一輪循環的值，初始化本輪的變量i時，就在上一輪循環的基礎上進行計算。

var tmp = 123;

if (true) {
  tmp = 'abc'; // ReferenceError
  let tmp;
}
複製代碼

ES6 明確規定，若是區塊中存在let和const命令，這個區塊對這些命令聲明的變量，從一開始就造成了封閉做用域。凡是在聲明以前就使用這些變量，就會報錯。
總之，在代碼塊內，使用let命令聲明變量以前，該變量都是不可用的。這在語法上，稱爲「暫時性死區」（temporal dead zone，簡稱 TDZ）。

1.二、頂層對象屬性

ES5 之中，頂層對象的屬性與全局變量是等價的。
ES6 爲了改變這一點，一方面規定，爲了保持兼容性，var命令和function命令聲明的全局變量，依舊是頂層對象的屬性；另外一方面規定，let命令、const命令、class命令聲明的全局變量，不屬於頂層對象的屬性。也就是說，從 ES6 開始，全局變量將逐步與頂層對象的屬性脫鉤。

同一段代碼爲了可以在各類環境，都能取到頂層對象，如今通常是使用this變量，可是有侷限性。 全局環境中，this會返回頂層對象。可是，Node 模塊和 ES6 模塊中，this返回的是當前模塊。

解構賦值

要想解構成功

• 右邊長度必須大於等於左邊？
• 右邊必須是可遍歷的，Iterator 結構 解構賦值容許指定默認值

字符串方法擴展

includes(), startsWith(), endsWith()
repeat()
padStart()，padEnd() 補全方法

函數的擴展

箭頭函數有幾個使用注意點。

（1）函數體內的this對象，就是定義時所在的對象，而不是使用時所在的對象。

（2）不能夠看成構造函數，也就是說，不可使用new命令，不然會拋出一個錯誤。

（3）不可使用arguments對象，該對象在函數體內不存在。若是要用，能夠用 rest 參數代替。

（4）不可使用yield命令，所以箭頭函數不能用做 Generator 函數。

數組的擴展

Array.from方法用於將兩類對象轉爲真正的數組：相似數組的對象（array-like object）和可遍歷（iterable）的對象（包括 ES6 新增的數據結構 Set 和 Map）。

Array.of方法用於將一組值，轉換爲數組。

ES6 提供三個新的方法——entries()，keys()和values()——用於遍歷數組。它們都返回一個遍歷器對象，能夠用for...of循環進行遍歷，惟一的區別是keys()是對鍵名的遍歷、values()是對鍵值的遍歷，entries()是對鍵值對的遍歷。

Array.prototype.includes方法返回一個布爾值，表示某個數組是否包含給定的值，與字符串的includes方法相似。

flat()默認只會「拉平」一層，若是想要「拉平」多層的嵌套數組，能夠將flat()方法的參數寫成一個整數，表示想要拉平的層數，默認爲1

flatMap()方法對原數組的每一個成員執行一個函數（至關於執行Array.prototype.map()），而後對返回值組成的數組執行flat()方法。該方法返回一個新數組，不改變原數組。

對象的擴展

this關鍵字老是指向函數所在的當前對象，ES6又新增了另外一個相似的關鍵字super，指向當前對象的原型對象。

屬性的賦值器（setter）和取值器（getter）

ES5 比較兩個值是否相等，只有兩個運算符：相等運算符（==）和嚴格相等運算符（===）。它們都有缺點，前者會自動轉換數據類型，後者的NaN不等於自身，以及+0等於-0。Object.is就是部署這個算法的新方法。它用來比較兩個值是否嚴格相等，與嚴格比較運算符（===）的行爲基本一致。

Object.assign方法用於對象的合併，將源對象（source）的全部可枚舉屬性，複製到目標對象（target）。

Object.keys()，Object.values()，Object.entries() Object.fromEntries()方法是Object.entries()的逆操做，用於將一個鍵值對數組轉爲對象

Set和Map數據結構

Set函數能夠接受一個數組（或者具備 iterable 接口的其餘數據結構）做爲參數，用來初始化。
向 Set 加入值的時候，不會發生類型轉換，
在 Set 內部，兩個NaN是相等。

Set和Map 結構的實例有四個遍歷方法，能夠用於遍歷成員。

keys()：返回鍵名的遍歷器 values()：返回鍵值的遍歷器 entries()：返回鍵值對的遍歷器

複製代碼

forEach()：使用回調函數遍歷每一個成員

Set 結構的實例默承認遍歷，它的默認遍歷器生成函數就是它的values方法。？？？

Set.prototype[Symbol.iterator] === Set.prototype.values
// true
複製代碼

這意味着，能夠省略values方法，直接用for...of循環遍歷 Set。

let set = new Set(['red', 'green', 'blue']);

for (let x of set) {
  console.log(x);
}
// red
// green
// blue
複製代碼

WeakSet 結構與 Set 相似，也是不重複的值的集合。可是，它與 Set 有兩個區別。

首先，WeakSet 的成員只能是對象，而不能是其餘類型的值。

其次，WeakSet 中的對象都是弱引用，即垃圾回收機制不考慮 WeakSet 對該對象的引用，也就是說，若是其餘對象都再也不引用該對象，那麼垃圾回收機制會自動回收該對象所佔用的內存，不考慮該對象還存在於 WeakSet 之中。

WeakSet 的成員是不適合引用的，由於它會隨時消失。另外，因爲 WeakSet 內部有多少個成員，取決於垃圾回收機制有沒有運行，運行先後極可能成員個數是不同的，而垃圾回收機制什麼時候運行是不可預測的，所以 ES6 規定 WeakSet 不可遍歷。

ES6 提供了 Map 數據結構。它相似於對象，也是鍵值對的集合，可是「鍵」的範圍不限於字符串，各類類型的值（包括對象）均可以看成鍵。也就是說，Object 結構提供了「字符串—值」的對應，Map 結構提供了「值—值」的對應，是一種更完善的 Hash 結構實現。若是你須要「鍵值對」的數據結構，Map 比 Object 更合適。

Proxy

Proxy 能夠理解成，在目標對象以前架設一層「攔截」，外界對該對象的訪問，都必須先經過這層攔截，所以提供了一種機制，能夠對外界的訪問進行過濾和改寫。

Proxy 實際上重載（overload）了點運算符，即用本身的定義覆蓋了語言的原始定義。

學習資源來自阮一峯老師的ECMAScript 6 入門