全文共3313字，預計學習時長10分鐘

圖源：

Set（集合）對象類型于2015年在*規范中提出，可以在 Node.js和大部分瀏覽器中使用。

*ECMA是 的縮寫。

即歐洲計算機制造商協會，是制定信息傳輸與通訊的國際化標準組織。

是ECMA制定的標準化腳本語言。

集合和數組很像，但是還是存在一定差別。

本文旨在探討這些差異，以及區別兩者的不同用法。下面正式開始。

新概念，集合

集合是ES6中非常特殊的對象類型。創建一個如下的空集合：

const =new Set()

可以在集合的構造函數里傳遞來填充它。就是一種可以循環訪問的對象，比如 Array（數組）或 String（字符串）。

const =new Set(['Rod', 'Todd', 'Sherri', 'Terri'])

值得信賴的主力，數組

數組是大多數應用程序的主要板塊，不論新舊。如果你以前編寫過，應該會對此比較熟悉。你可以寫出類似的數組：

const =['Rod', 'Todd', 'Sherri', 'Terri']

所以重點是？

圖源：

這兩種數據類型是相似的，但是要做的事情卻略有不同。集合表示一組唯一的項，而數組的應用更為廣泛。

有個很好的例子來表示集合，就像大學生的在一個學期的課程。他們可以修一門或多門課程，但是同一學期同一門課他們只能修一次。

const courses = newSet(['English', 'Science', 'Lego '])

const cards = [

'Machop',

'Diglett',

'',

'Machop',

''

另一方面，一組寶可夢卡牌就不是用于形容集合的好例子，因為這里面有重復。這種情況，用數組可以更好的表示數據。

const cards = [

'Machop',

'Diglett',

'',

'Machop',

''

重復的部分可以傳輸到集合中，但是他們不會被存入。將下面的代碼復制到你的瀏覽器控制臺，自己看看：

new Set([

'Machop',

'Diglett',

'',

'Machop',

''

])// Set(4) {"Machop", "Diglett", "",""}

傳遞到集合的數組包括兩個Machop，但是集合里只保留一份副本。這種行為非常微妙，但是很有用。

這有什么用？

假設你正在開發一個博客，想要添加一個功能，允許訪問者搜索符合一個或多個類別匹配的文章。每個類別只使用一次。

如果你使用數組來代表活動類別列表，你就需要注意避免重復。這可以通過檢查沒添加類別的列表來實現。

類函數indexOf或可以應用于此：

// If our list doesnot include the

if (!list.()) {

// Then add the new to thelist

list.push()

我曾經發現自己一直在編寫這類的代碼，但是集合可以自動處理這些問題。你可以直接用類函數add，集合將始終獨一無二。

// Just add to the list

// No need to perform any checks in advance!

list.add()

將集合轉變回數組

我們已經知道，通過將數組傳遞到集合的構造函數中，數組可以轉化為集合，但是集合是如何轉化為數組的呢？

一種方法是靜態地使用類函數from

const set = newSet(['', 'The Wizard of Oz', 'Jaws'])

const arr = Array.from(set)

console.log(arr)// (3) ["", "The Wizard of Oz","Jaws"]

ES6延展操作符是另一個選擇：

const set = newSet(['', 'The Wizard of Oz', 'Jaws'])

const arr = [...set]

console.log(arr)// (3) ["", "The Wizard of Oz","Jaws"]

集合不支持諸如map,filter和reduce這些函數式編程方法，因此，將他們轉換成數組更方便。

使用集合從數組中刪除重復

即使更傾向于在數組中保存數據，集合依舊很有用。從數組中刪除重復項的一個簡便方法，就是將它轉化為集合后再重新轉化成數組。

const cards = [

'Machop',

'Diglett',

'',

'Machop',

''

const = [...new Set(cards)]

console.log()// (4) ["Machop", "Diglett","", ""]

如何辨別哪些值是唯一的？

圖源：

目前為止，已經知道集合如何只保留唯一的值，但這些唯一的值是怎么確定的呢？下面來討論一下。

首先，讓3這個值在集合里出現兩次：

new Set([1, 2, 3, 4,3])// Set(4) {1, 2, 3, 4}

第二個3消失了。這和我們目前學到的內容是一致的，但是如果把3作為字符串添加會是什么樣的呢？

new Set([1, 2, 3, 4,'3'])// Set(5) {1, 2, 3, 4, "3"}

有趣了。認為3和“3”是不同的。如果我們將匹配的數組加入集合會怎么樣呢？

new Set([[''], ['Jesse Pinkman']])// Set(4) {['Jesse Pinkman'], ['Jesse Pinkman']}

在這種情況下，集合保留兩個具有相同內容的數組。那么對象呢？

new Set([{name: ''}, {name: 'Ron '}])// Set(2) {{name: 'Ron '}, {name:'Ron '}}

有匹配鍵和值的對象字面值，也被認為是不同的......

這該如何解釋？

集合使用絕對相等 (===)來確定哪些值是唯一的。這解釋了為什么集合同時保留3（數字）和“3”（字符串）的副本。

這同樣解釋了，為什么數組和對象字面值相同，卻被認為是唯一的。通過他們的引用來比較對象，而不是他們的內容，而數組至少有特殊類型的對象。

總結

圖源：

集合為開發者提供了新方法表示數據。數組仍然是應用程序中通用的主力，集合則主要為了表示唯一的值的集合。

集合和數組之間的轉換很容易。你可以使用集合來確保數據保持唯一，然后將其轉化為數組，以便使用map、filter和reduce等函數。

集合使用絕對相等來比較值，并確定什么是唯一的。 因為通過引用比較對象，數組和對象字面值即使內容相同，也會被認為是唯一的。

本文重點討論有關集合的概念。現在你應該知道了什么時候該用集合，什么時候用數組更好了吧？