文章目錄

• 1. 基本語法
• 2. 遍歷方式
• 3. WeakSet

在 JavaScript 里通常使用Array或Object來存儲數據。 在 ES6 中，新增了數據結構 Set 和 Map，它們分別對應傳統數據結構的“集合”和“字典”。首先，我們先來學習下 Set 數據結構。

ES6 提供了新的數據結構 Set。它類似于數組，但是成員的值都是唯一的，沒有重復的值。

1. 基本語法

// 生成Set實例,可初始化為空 let s = new Set() // 初始化的參數必須是可遍歷的，可以是數組或者自定義遍歷的數據結構。 let s = new Set([1, 2, 3, 4])

添加數據

s.add('hello') s.add('goodbye') // 也支持鏈式寫法 s.add("hello").add('world')

Set 數據結構不允許數據重復，所以添加重復的數據是無效的（可以用來去重）

刪除數據

// 刪除指定數據 s.delete('hello') // true // 刪除全部數據 s.clear()

統計數據

// 判斷是否包含數據項，返回 true 或 false s.has('hello') // true // 計算數據項總數 s.size // 2

數組去重

let arr = [1,2, 2, 3, 4, 2, 3, 1] let s = new Set(arr) console.log(s) // Set(4) {1, 2, 3, 4}// 合并去重 let arr1 = [1, 2, 3, 4] let arr2 = [2, 3, 4, 5, 6] let s = new Set([...arr1, ...arr2]) console.log([...s]) // [1, 2, 3, 4, 5, 6] console.log(Array.from(s)) // [1, 2, 3, 4, 5, 6]

交集

let s1 = new Set(arr1) let s2 = new Set(arr2) let result = new Set(arr1.filter(item => s2.has(item))) console.log(Array.from(result))

差集

let arr3 = new Set(arr1.filter(item => !s2.has(item))) let arr4 = new Set(arr2.filter(item => !s1.has(item))) console.log(arr3) console.log(arr4) console.log([...arr3, ...arr4])

2. 遍歷方式

• keys()：返回鍵名的遍歷器
• values()：返回鍵值的遍歷器
• entries()：返回鍵值對的遍歷器
• forEach()：使用回調函數遍歷每個成員
• for...of：直接遍歷每個成員

let s = new Set(['hello','world']) s.forEach(item => {console.log(item) // hello // world })for (let item of s) {console.log(item) // hello // world }for (let item of s.keys()) {console.log(item) // hello // world }for (let item of s.values()) {console.log(item) // hello // world }for (let item of s.entries()) {console.log(item[0], item[1]) // hello hello // world world }

3. WeakSet

WeakSet 結構與 Set 類似，也是不重復的值的集合。但是，它與 Set 有兩個區別。

• WeakSet 的成員只能是對象，而不能是其他類型的值；
• WeakSet 沒有size屬性，沒有辦法遍歷它的成員

WeakSet 有三個方法：add, delete, has

const ws = new WeakSet() ws.add(1) // TypeError: Invalid value used in weak set ws.add(Symbol()) // TypeError: invalid value used in weak set let ws = new WeakSet() const obj1 = {name: 'imooc' } const obj2 = {age: 5 } ws.add(obj1) ws.add(obj2) ws.delete(obj1) console.log(ws) console.log(ws.has(obj2)) // true

WeakSet 中的對象都是弱引用，即垃圾回收機制不考慮 WeakSet 對該對象的引用，也就是說，如果其他對象都不再引用該對象，那么垃圾回收機制會自動回收該對象所占用的內存，不考慮該對象還存在于 WeakSet 之中。

那么它有啥作用呢？

• 避免內存泄露（用于存儲DOM節點，而不用擔心這些節點從文檔移除時會引發內存泄露）

const foos = new WeakSet() class Foo {constructor() {foos.add(this)}method() {if(!foos.has(this)) {throw new TypeError("Foo.prototype..method 只能在Foo的實例上調用")}} } // 這段代碼的作用是保證了Foo 的實例方法只能在Foo的實例上調用。 // 這里用WeakSet的好處：數組foos對實例的引用不會被計入內存回收機制，所以刪除實例時無需考慮foos， 也不會出現內存泄露 創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的【ES6(2015)】Set的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。