【JS012】ES6的学习笔记之数据结构——集合Set

日期：2021年8月23日
作者：Commas
注释：如果您觉得有所帮助，帮忙点个赞，也可以关注我，我们一起成长；如果有不对的地方，还望各位大佬不吝赐教，谢谢^ - ^
(ง •_•)ง 积跬步以致千里，ES6的学习笔记
1.01³⁶⁵ = 37.7834；0.99³⁶⁵ = 0.0255
1.02³⁶⁵ = 1377.4083；0.98³⁶⁵ = 0.0006

---

---

一、Set的介绍

说明：ES6提供了新的数据结构Set（集合）。集合类似于数组，但是成员的值却是唯一的，没有重复的，并且还实现了iterator接口，因此可以使用...（扩展运算符）和for...of...进行遍历。

• 语法：let newSet = new Set(param);
  注意：param参数应该实现了iterator接口
  本质：Set本身是一个构造函数，用来生成Set数据结构。

let emptySet = new Set();
console.log(emptySet);
//控制台输出：Set(0) {}

let nameSet = new Set(["张三","李四","王五","李四","王五"]);
console.log(nameSet);
//控制台输出：Set(3) {"张三", "李四", "王五"}

二、Set属性和方法

序号	属性或方法	描述
1	size	返回集合的元素个数，类似于数组的length
2	add	新增一个元素，并返回当前集合
3	delete	删除元素，并返回boolean值
4	has	检测集合中是否包含某个元素，并返回boolean值
5	keys	【遍历-方法1】：返回键名的遍历器
6	values	【遍历-方法2】：返回键值的遍历器
7	entries	【遍历-方法3】：返回键值对的遍历器
8	foreach	【遍历-方法4】：使用回调函数遍历每个成员
9	clear	清空集合

let nameSet = new Set(["张三","李四","王五"]);
console.log(nameSet);
//控制台输出：Set(3) {"张三", "李四", "王五"}

//（1）size
console.log(nameSet,nameSet.size);
//控制台输出：
//Set(3) {"张三", "李四", "王五"} 3

//（2）add
console.log(nameSet,nameSet.add("赵六"));
//控制台输出：
//Set(4) {"张三", "李四", "王五", "赵六"} 
//Set(4) {"张三", "李四", "王五", "赵六"}

//（3）delete
console.log(nameSet,nameSet.delete("张三"));
//控制台输出：
//Set(3) {"李四", "王五", "赵六"} true

//（4）has
console.log(nameSet,nameSet.has("李四"));
//控制台输出：
//Set(3) {"李四", "王五", "赵六"} true

//（5）keys
console.log(nameSet.keys());
//控制台输出：
//SetIterator {"李四", "王五", "赵六"}
for(let item of nameSet.keys()){
    console.log(item);
};
//控制台输出：
//李四
//王五
//赵六

//（6）values
console.log(nameSet.values());
//控制台输出：
//SetIterator {"李四", "王五", "赵六"}
for(let item of nameSet.values()){
    console.log(item);
};
//控制台输出：
//李四
//王五
//赵六

//Set 结构的实例默认可遍历，它的默认遍历器生成函数就是它的values方法。
Set.prototype[Symbol.iterator] === Set.prototype.values
// true
for(let item of nameSet){
    console.log(item);
};
//控制台输出：
//李四
//王五
//赵六

//（7）entries
console.log(nameSet.entries());
//控制台输出：
//SetIterator {"李四" => "李四", "王五" => "王五", "赵六" => "赵六"}
for(let item of nameSet.entries()){
    console.log(item);
};
//控制台输出：
//(2) ["李四", "李四"]
//(2) ["王五", "王五"]
//(2) ["赵六", "赵六"]

//（8）forEach
nameSet.forEach(function(value,key){
    console.log(`value=${value},key=${key}`);
})
//控制台输出：
//value=李四,key=李四
//value=王五,key=王五
//value=赵六,key=赵六

//（9）clear
nameSet.clear();
console.log(nameSet,nameSet.size);
//控制台输出：
//Set(0) {} 0

知识加油站：Set的遍历顺序就是插入顺序。这个特性有时非常有用，比如使用 Set 保存一个回调函数列表，调用时就能保证按照添加顺序调用。

三、Set的遍历

• 总共有4种：keys、values、entries和foreach，示例请看【二、Set属性和方法】；

四、Set的用途

• 数组去重
  语法：let arr = [...new Set(arr)];

let nameArr = ["张三","李四","王五","张三","李四"]
console.log(nameArr);
//控制台输出：
//(5) ["张三", "李四", "王五", "张三", "李四"]

let nameSet = new Set(nameArr);
console.log(nameSet);
//控制台输出：
//Set(3) {"张三", "李四", "王五"}

nameArr = [...nameSet];
console.log(nameArr);
//控制台输出：
//(3) ["张三", "李四", "王五"]

也可以简化写成：

let nameArr = ["张三","李四","王五","张三","李四"]
console.log(nameArr);
//控制台输出：
//(5) ["张三", "李四", "王五", "张三", "李四"]

nameArr = [...new Set(nameArr)];
console.log(nameArr);
//控制台输出：
//(3) ["张三", "李四", "王五"]

• 交集（Intersect）
  

let nameArr1 = ["张三","李四","张三"];
let nameArr2 = ["王五","李四"];

//先去重
nameArr1 = [...new Set(nameArr1)];
//(2) ["张三", "李四"]

nameSet2 = new Set(nameArr2);
//Set(2) {"王五", "李四"}

//求并集
let result = nameArr1.filter(item=>{
    if(nameSet2.has(item)){
        return true;
    }else{
        return false;
    }; 
});

console.log(result);
//控制台输出：["李四"]

也可以简化写成：

let nameArr1 = ["张三","李四","张三"];
let nameArr2 = ["王五","李四"];

let result = [...new Set(nameArr1)].filter(item=> new Set(nameArr2).has(item));

console.log(result);
//控制台输出：["李四"]

• 并集（Union）

let nameArr1 = ["张三","李四","张三"];
let nameArr2 = ["王五","李四"];

//合并数组
let nameArr = [...nameArr1,...nameArr2];

//去重处理
let result = [...new Set(nameArr)];

console.log(result);
//控制台输出：(3) ["张三", "李四", "王五"]

也可以简化写成：

let nameArr1 = ["张三","李四","张三"];
let nameArr2 = ["王五","李四"];

let result = [...new Set([...nameArr1,...nameArr2])];

console.log(result);
//控制台输出：(3) ["张三", "李四", "王五"]

• 差集（Difference）
  

let nameArr1 = ["张三","李四","张三"];
let nameArr2 = ["王五","李四","赵六"];

let result1 = [...new Set(nameArr1)].filter(item=> !(new Set(nameArr2).has(item)));
console.log(result1);
//控制台输出：["张三"]

let nameArr1 = ["张三","李四","张三"];
let nameArr2 = ["王五","李四","赵六"];

let result2 = [...new Set(nameArr2)].filter(item=> !(new Set(nameArr1).has(item)));
console.log(result2);
//控制台输出：(2) ["王五", "赵六"]

---

参考文章：
1、《Set 和 Map 数据结构》
2、《3.1.1 ES6 Map 与 Set》

---

版权声明：本文为博主原创文章，如需转载，请给出：
原文链接：https://blog.csdn.net/qq_35844043/article/details/119887849