總結：ES6新增了Set結構，用於都是存儲不重複的成員值，提供了一些方法和屬性供開發者使用；類似的結構還有WeakSet結構，不同點是後者的成員必須是對象類型，且不支持遍歷操作。

題外話：往後的章節，跟前面的章節聯繫越來越緊密，很多知識的講解建立在前面章節的學習基礎上，如果是新來的同學，建議從第一節學起。

一、什麼是Set結構

Set是ES6給開發者帶來的一種新的數據結構，你可以理解為值的集合。我們平時見到的數組Array也是一種數據結構，但是Set跟其他數據結構不同的地方就在於：它的值不會有重複項。

（1）基本用法

我們從最基本的學起，Set的用法：

Set本身是一個構造函數，你可以理解為一個類，使用的時候需要用new來創建一個實例。以上的案例就是這樣創建出一個Set結構，我們列印出來看看，控制台輸出：Set{ }。

它不是值的集合嗎，那如果我們想給Set對象增加一些值成員，我們要怎麼做？

你可以這樣：

案例中，用數組[ 1,2,3 ]作為參數傳入，得到的變數s為Set { 1, 2, 3 }。

除了上面的方法，你還可以這樣：

如果你不想用數組作為參數來傳值初始化變數s，你還可以通過Set 結構提供的add方法來添加方法，也是沒問題的。

（2）成員值唯一

很明顯，set結構會自動忽略相同的值，只會保留一個相同的值。

Set 結構除了提供add方法用於添加成員以外，還提供了哪些方法和屬性呢？

（3）size屬性

size屬性：獲取成員的個數。

1、delete( )方法、

delete( )方法：用戶刪除Set結構中的指定值，刪除成功返回：true，刪除失敗返回：fasle。

案例中，我們使用delete( )方法刪除了指定值：2，結果返回true。刪除指定值：4的時候，返回false，原因是變數s中找不到數字4。

當Set結構的成員比較多，你覺得一個一個刪除比較麻煩的時候，你可以用下面這個方法。

2、clear()方法

clear( )方法：清除所有成員。

3、has( )方法

has( )方法：判斷set結構中是否含有指定的值。如果有，返回true；如果沒有，返回fasle。

還記得ES6為數組帶來的entries( )函數用於遍曆數組，Set結構也提供了這樣的方法。

4、entries( )方法

注意得到的結果，成員值「a」對應的鍵值對是[「a」,」a」]，也就是說：Set結構是鍵名和鍵值是同一個值。

5、keys( ) 和 values( ) 方法

keys( )方法：返回鍵名的遍歷器。

values( )方法：返回鍵值的遍歷器。

我把兩個函數放在一起演示，是因為上面entries()方法的使用告訴我們，Set結構的鍵名和鍵值是同一個值，那麼我們就用Set結構提供的keys( )和values()方法來檢驗一下。從得到的結果可以看出：兩者確實一致。

我們在第十二節講過，for...of可以遍歷set和map結構等具有遍歷器介面的數據結構。正好上面說的entries()方法、key()方法、values( )方法會返回遍歷器，我們來補回用for...of遍歷Set結構的講解。

我們用其中的entries( )方法演示（keys( )和values( )用法一樣），可以看得出，用法和數組的for...of遍歷是一樣的。

除了提供以上三個方法對Set結構進行遍歷以外，你還可以用這個方法遍歷。

forEach( )方法

使用方式跟數組的forEach一樣。當然，得到的value是key的值是一樣的。

四、set的用途

數組去重：

上面的代碼重點是一個含有重複元素的數組，作為參數，用於初始化一個Set實例對象，因為Set結構不會含有重複成員，就會自動忽略相同的元素，只保留一個相同的值。

面用到的Array.from( )，屬於ES6為數組擴展的特性

五、WeakSet結構

講到Set結構，就不能不講WeakSet結構。Set和WeakSet兩者名字就很像，註定它們有很多一樣的地方。

WeakSet結構同樣不會存儲重複的值，不同的是，它的成員必須是對象類型的值。（嚴格來說是：具有 iterable 介面的對象）

我們初始化一個WeakSet對象，參數一個數組，數組的成員必須是對象類型的值{"age":18}，否則就會報錯。

以上的寫法就會報錯，因為數組的元素不是對象類型的，是數字1,2。

實際上，任何可遍歷的對象，都可以作為WeakSet的初始化參數。比如：數組。

同樣，WeakSet結構也提供了add( ) 方法，delete( ) 方法，has( )方法給開發者使用，作用與用法跟Set結構完全一致。

另一個不同點是：WeakSet 結構不可遍歷。因為它的成員都是對象的弱引用，隨時被回收機制回收，成員消失。所以WeakSet 結構不會有keys( )，values( )，entries( )，forEach( )等方法和size屬性。

這節內容比較多，堅持下來的小夥伴都很棒！！！

推薦閱讀：

相关文章