Set

Set 是 ES6 提供給我們的構造函數，能夠造出一種新的存儲數據的結構

特點：只有屬性值沒有屬性名，成員值唯一

用途：可以轉成數組，其本身具備去重(自動去重)，交集，并集，差集的作用等

參數必須具備迭代接口，只要原型上存在Symbol(Symbol.iterator)屬性就說明具備迭代接口，如：數組、字符串、arguments、NodeList

Set.add()

向 Set 對象中添加數據

Set 自動去重

Set.delete()

刪除 Set 對象中對應的值，如果要刪除數組等值，必須提前將數組設置為變量添加入 Set 對象

Set.clear()

清空 Set 對象中的值

Set.has()

判斷 Set 對象中是否含有對應值

Set.forEach()????&&????for of

Set.forEach()遍歷 Set 對象：

ES6新增 for of 遍歷 Set 對象：

能被 for of 遍歷的同樣得具備迭代接口

Set 操作數組

將數組轉換為 Set 對象：

將 Set 對象轉換為數組：Array.from()

該方法能夠將類數組和所有具備迭代接口的數據轉換為數組

... 展開運算符

... 運算符同樣能夠拓展數組或任何具備迭代接口的數據

使用 Set 進行數組去重

Set 在去重方便相當的老道，如果瀏覽器支持，則盡量使用 Set 進行去重

使用?Set 進行取并集

使用 Set 進行取交集

使用 Set 進行取差集

但是要注意的是，如果數據量很大，是不在前端進行處理的，通常交給后臺處理。

Map

Map 是 ES6 提供給我們的構造函數，能夠造出一種新的存儲數據的結構，本質上是鍵值對的集合。

特點：key 對應 value，key 和 value 唯一，任何值都可以當屬性

用途：讓對象作為屬性，去重

原理：鏈接鏈表、hash 算法、桶

Map.set()

Map 最大的特點即可以將對象作為屬性

向 Map 中添加屬性

Map.get()

從 Map 中取值

值得注意的是，Map 與 Set 相同，對引用值進行取值必須先使用變量存儲引用值，再使用變量添加到 Map 上，即可通過變量取到對應值。

Map.delete()

從 Map 對象中刪除數據

Map.clear()

將 Map 對象清空

Map.keys()

取出 Map 對象的所有屬性，方便對全部的值進行遍歷

Map.forEach()????&&????for of

Map 對象也同樣能夠使用 forEach 和 for of 進行遍歷

Map.forEach()：

for of：

需要注意的是，for of 中取出的 Map 對象的 val 為 包含一對鍵值對的數組，可以通過 val [0] 和 val [1] 來去對應值

Map.has()

判斷 Map 對象中是否含有對應屬性

總結一下Map：不重復，key 和 value 唯一，相同的值后來的會覆蓋前面的

可以接受的值有 字符串 對象 NaN null [ ] function () {} number

擁有一系列方法 set get delete has clear

Map 原理及實現

Map 對象可以看做是一個桶，給桶中劃分幾個對象用于存放數據的鏈表

初始化桶 init ()

先把這個桶初始化，桶里面默認劃分8個對象用于存儲

hash 算法?makeHash ()

為了使桶中的單一鏈表不出現太長的情況，需要設計一個 hash 算法對放入 Map 的桶中的元素分配不同的 hash 值進行分類。如果采用該方式后鏈表還是太長則只能考慮增加桶中的對象個數

存儲更新數據方法 set ()

處理完數據的存儲之后就剩 Map 對象上的一些方法了，首先看一下存儲更新數據的方法 set

首先將要存入的數據的屬性名使用 hash 算法得到一個 hash 值，用 hash 值選擇到 Map 的桶中將要存入的對應的對象。然后對要存入的數據進行分析，如果鏈表中不存在該數據，則將該數據添加到鏈表末端。如果數據已存在，則直接替換對應的 value 值進行數據更新。

獲取數據方法 get ()

相同的值通過 hash 算法算出的 hash 值一定是相同的，所以從 Map 對象中取數據也先將所要取的數據的屬性名通過 hash 算法算出所對應的鏈表，通過鏈表中的 next 屬性對鏈表進行遍歷，最終實現獲取對應的數據

刪除數據方法 delete ()

刪除方法主要實現的是從鏈表中刪除一個節點時，將前一個節點的 next 屬性指向原本的下一個節點。

查找數據方法 has ()

與 get 方法大致相同

清除數據方法 clear ()

這里直接初始化一個桶完事簡單粗暴。

總結

以上是生活随笔為你收集整理的set和map去重调用什么方法_【ES6】Set、Map的全部內容，希望文章能夠幫你解決所遇到的問題。

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