JavaScript中Set集合的方法詳情

更新時間：2022年09月14日 09:34:09 作者：i東東

這篇文章主要介紹了JavaScript中Set集合的方法詳情，Set是唯一值的集合。每個值在Set中只能出現(xiàn)一次。一個Set可以容納任何數(shù)據(jù)類型的任何值

Set集合概述

Set集合和Arry數(shù)組很相似，但是Set集合存儲的是key也就是說Set集合中不可以存在兩個值和數(shù)據(jù)類型都相等的key
Set集合不可以用下標(biāo)取值
Set集合沒有l(wèi)ength屬性而是size
Set集合可以通過Array.from轉(zhuǎn)為真正的數(shù)組

如何創(chuàng)建并使用 Set

創(chuàng)建一個 Set 并添加現(xiàn)有變量：

// 創(chuàng)建變量
const a = "a";
const b = "b";
const c = "c";

// 創(chuàng)建 Set
const letters = new Set();

letters.add(a);
letters.add(b);
letters.add(c);

Add()

往集合添加元素,會進行去重，重復(fù)的元素添加只會顯示一個

var set = new Set()
set.add(1)
console.log(set); // {1}

var set = new Set().add(1).add([2,3,4])
console.log(set); // {1, [2,3,4]}

var set = new Set([1,2,3,4,5,6]);
console.log(set.add(123)); // {1, 2, 3, 4, 5,6,123} 說明添加成功了
console.log(set.add(1)); // {1, 2, 3, 4, 5,6,123} 說明重復(fù)的沒有添加成功

Clear()

清空Set對象

var set = new Set([1,2,3,4,5,6]);
set.clear()
console.log(set); // {size: 0} 清空成功

Delete()

刪除Set對象中的值

var set = new Set([1,2,3,4,5,6]);
console.log(set.delete(1));  // true 說明刪除成功
console.log(set.delete(1));  // false說明刪除失敗,因為集合中已經(jīng)不存在 1
console.log(set);   // [2,3,4,5,6] 1被刪除掉了

Entries()

Entries() 方法返回一個數(shù)組的迭代對象，該對象包含數(shù)組的鍵值對 (key/value)。迭代對象中數(shù)組的索引值作為 key，數(shù)組元素作為 value。

var set = new Set([1,2,3,4,5]);
console.log(set); // {1, 2, 3, 4, 5}
console.log(set.entries()); // {1 => 1, 2 => 2, 3 => 3, 4 => 4, 5 => 5}

Has()

判斷Set對象中某個值是否存在，存在返回true，不存在返回false

var set = new Set([1,2,3,4,5]);
console.log(set.has(1)); // ture 說明Set對象中存在1
console.log(set.has(6)); // false 說明Set對象中不存在6

ForEach()

為每個元素調(diào)用回調(diào) 它具有三個參數(shù):

.value：可選，Set對象中元素的值。
.key：可選由于Set對象沒有鍵，所以key的值和value的值相同。
.setObj:可選，Set對象本身。

var set = new Set([1,2,3,4,5]);
set.forEach((value,key,setObj)=>{
  console.log(value,key,setObj);
})
// 1 1 {1, 2, 3, 4, 5}
// 2 2 {1, 2, 3, 4, 5}
....

Keys() 與 values()

返回Set對象的key值數(shù)組，返回Set對象的value值數(shù)組

var set = new Set([1,2,3,4,5]);
console.log(set.keys()); // {1, 2, 3, 4, 5}
console.log(set.values()); // {1, 2, 3, 4, 5}

Size

返回Set對象中元素計數(shù)

var set = new Set([1,2,3,4,5]);
console.log(set.size);  // 5

Set 對象的方法和屬性集合

名稱	說明
new Set()	創(chuàng)建新的 Set 對象。
add()	向 Set 添加新元素。
clear()	從 Set 中刪除所有元素。
delete()	刪除由其值指定的元素。
entries()	返回 Set 對象中值的數(shù)組。
has()	如果值存在則返回 true。
forEach()	為每個元素調(diào)用回調(diào)。
keys()	返回 Set 對象中值的數(shù)組。
values()	與 keys() 相同。
size	返回元素計數(shù)。