javascript之set和weakset的用法

今天我们来介绍一下数据结构Set和weakset

简单介绍

Set其实类似于数组，但是其中的成员值都是唯一的，没有重复的值。

如何构造一个Set？

Set本身也是一个构造函数，用来生成Set，其参数可以是空，可以是数组，可以是类似数组的对象（比如NodeList）

如果不清楚NodeList可以看这篇文章：

(4条消息) javascript 中的nodeList理解_我只是搬运工的博客-CSDN博客_js listnode

构造Set时的不同参数类型如下代码举例：

//参数为空
let set=new Set();

//参数为数组
let a=new Set([2,3,4,5,6,6,8,NaN,NaN,{},{}])

//参数是类似数组的对象
let tem=document.querySelectorAll('p')

==Set去重的依据是什么呢？==

类似于“===”，但是有几个不同之处：

在Set中，两个NaN是相等的，两个空对象是不相等的。

Set实例的操作方法

Set有四个主要的操作方法：add()、delete()、has()、clear()

add(value)为Set添加某个值，返回set本身
delete(value)删除Set中的某个值，返回一个布尔值，说明删除是否成功
has(value)返回一个布尔值，说明Set中是否存在某个值
clear()清除Set中的所有值

Set的遍历方法

keys() 遍历Set的键名
values() 遍历Set的键值
entries() 遍历Set的键值对
forEach() 调用回调函数遍历Set的每个成员

因为keys、values、entries返回的都是迭代器，所以无法直接得到键名或键值，如果想要获得键名或键值，我们可以使用for…of


let a=new Set([2,3,4,5,6,6,8,NaN,NaN,{},{}])
for(let i of a.keys()){
    console.log(i)
}

Set方法的应用

数组去重
使用Array.from()以及Set的构造函数：
1
2
3
4
5
6

let change=function (arr){
return Array.from(new Set(arr))
}
change([1,1,2,4,4,6])
使用数组的forEach以及Set的add方法


let set=new Set();
[1,2,3,4,4].forEach(x=>set.add(x))//会去重
console.log(set)

修改Set中的值
首先我们需要了解如何将Set转为数组？

=>使用扩展运算符…


let a=new Set([2,3,4,5,6,6,8,NaN,NaN,{},{}])
console.log(a)//  Set(9) { 2, 3, 4, 5, 6, 8, NaN, {}, {} }
console.log([...a])   //[2, 3, 4, 5, 6, 8, NaN, {}, {}]

然后我们试着利用Set和map来修改Set中的值：


let b=new Set([1,1,3,4,5,5,6,8])
let c=new Set([...b].map(x=>x*2))
console.log(c) // Set(6) { 2, 6, 8, 10, 12, 16 }

WeakSet的使用其实和Set比较类似，他们的区别主要有两个：

WeakSet的成员只能是对象，而不是能是别的类型的值
WeakSet的对象都是弱引用，不能遍历

什么叫弱引用呢，就是如果其他对象都不再引用该对象，那么垃圾回收机制会自动回收该对象所占用的内存，不考虑该对象还存在于 WeakSet 之中。

WeakSet有三个方法：

add(value) 增加某个值
delete(value) 删除某个值
has(value) 判断某个值是否存在

因为WeakSet不可遍历，WeakSet没有size属性，没有forEach方法。

关于Set的用法可以参考这篇博客：

【javaScript】之Set的用法_qwerty053的博客-CSDN博客