ECMAScript 6 集合，第 1 部分：集合
在 JavaScript 的大部分歷史中，Array 代表的集合類型只有一種 類型。數組在 JavaScript 中的使用與數組和其他語言一樣，但也用於模擬隊列和堆棧的雙重和三重職責。由於數組只使用數字索引，開發人員必須在需要非數字索引時使用對象。 ECMAScript 6 引入了幾種新的集合類型，以便更好、更高效地存儲訂單數據。
套裝
如果您來自 Java、Ruby 或 Python 等語言但 JavaScript 中缺少集合，那麼集合併不是什麼新鮮事。集合位於不能包含重複值的有序值列表中。您通常不會像訪問數組中的項目那樣訪問集合中的項目，而是更常見的是檢查集合以查看是否存在值。
ECMAScript 6 引入了 Set 輸入
1
作為 JavaScript 的集合實現。您可以使用 add() 將值添加到集合中 方法並使用 size 查看集合中有多少項目 ：
var items = new Set();
items.add(5);
items.add("5");
console.log(items.size); // 2
ECMAScript 6 集在確定值是否相同時不會強制值。所以，一個集合可以包含兩個數字 5 和字符串 "5" （在內部，比較是使用 === ）。如果 add() 使用相同的值多次調用方法，第一個之後的所有調用都將被有效忽略：
var items = new Set();
items.add(5);
items.add("5");
items.add(5); // oops, duplicate - this is ignored
console.log(items.size); // 2
您可以使用數組初始化集合，Set 構造函數將確保只使用唯一值：
var items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);
console.log(items.size); // 5
在此示例中，包含提要項的數組用於初始化集合。數字 5 即使它在數組中出現四次，也只在集合中出現一次。此功能可以輕鬆地將現有代碼或 JSON 結構轉換為使用集合。
您可以使用 has() 測試以查看集合中有哪些項目 方法：
var items = new Set();
items.add(5);
items.add("5");
console.log(items.has(5)); // true
console.log(items.has(6)); // false
最後，您可以使用 delete() 從集合中移除一個項目 方法：
var items = new Set();
items.add(5);
items.add("5");
console.log(items.has(5)); // true
items.delete(5)
console.log(items.has(5)); // false
或者，如果你想從集合中刪除所有項目，你可以調用 clear() ：
var items = new Set();
items.add(5);
items.add("5");
console.log(items.has(5)); // true
items.clear()
console.log(items.has(5)); // false
所有這些都相當於一種非常簡單的機制來跟踪唯一的無序值。
迭代
即使沒有隨機訪問集合中的項目，仍然可以使用新的 ECMAScript 6 for-of 迭代所有集合值 聲明
2
. for-of statement 是一個循環，它遍歷集合的值，包括數組和類似數組的結構。您可以像這樣在集合中輸出值：
var items = new Set([1, 2, 3, 4, 5]);
for (let num of items) {
console.log(num);
}
此代碼按照添加到集合中的順序將集合中的每個項目輸出到控制台。
示例
目前，如果您想跟踪唯一值，最常見的方法是使用一個對象並將唯一值分配為具有一些真實值的屬性。比如有一個 CSS Lint 3 查找重複屬性的規則。現在，使用一個對象來跟踪 CSS 屬性，例如：
var properties = {
"width": 1,
"height": 1
};
if (properties[someName]) {
// do something
}
為此目的使用對象意味著始終為屬性分配真實值，以便 if 語句正常工作（另一個選項是使用 in 運算符，但開發人員很少這樣做）。使用集合可以使整個過程變得更容易：
var properties = new Set();
properties.add("width");
properties.add("height");
if (properties.has(someName)) {
// do something
}
由於只關心該屬性是否之前使用過而不是使用了多少次（沒有關聯額外的元數據），因此使用集合實際上更有意義。
對此類操作使用對象屬性的另一個缺點是屬性名稱總是轉換為字符串。所以你不能有一個屬性名稱為 5 的對象 , 你只能有一個屬性名稱為 "5" .這也意味著您不能以相同的方式輕鬆跟踪對象，因為對像在分配為屬性名稱時會轉換為字符串。另一方面，集合可以包含任何類型的數據，而不必擔心轉換為另一種類型。
瀏覽器支持
Firefox 和 Chrome 都實現了 Set ，但是，在 Chrome 中，您需要手動啟用 ECMAScript 6 功能：轉到 chrome://flags 並啟用“實驗性 JavaScript 功能”。兩種實現都不完整。兩種瀏覽器都沒有使用 for-of 實現集合迭代 .
總結
ECMAScript 6 集是該語言的一個受歡迎的補充。它們允許您輕鬆創建唯一值的集合，而無需擔心類型強制。即使無法直接訪問集合中的項目，您也可以非常輕鬆地從集合中添加和刪除項目。如有必要，仍然可以使用 ECMAScript 6 for-of 迭代集合中的項目 聲明。
由於 ECMAScript 6 尚未完成，在其他瀏覽器開始包含 Set 之前，實現和規範也可能會發生變化 .目前，它仍被視為實驗性 API，不應在生產代碼中使用。這篇文章以及其他關於 ECMAScript 6 的文章只是為了預覽即將推出的功能。
更新
- 2014 年 1 月 5 日 – 更改了對
size()的引用size的方法 屬性以反映規範的變化。
參考
- 簡單的地圖和集合（ES6 Wiki）
- 為……的 (MDN)
- CSS Lint
- 設置 (MDN)
