一、课程名称：前端工程师2022版
二、课程章节：ES6语法扩展-Set和Map数据结构
三、课程讲师：Alex
四、课程内容
1、Set构造函数的参数
（1）数组
const s = new Set([1,2,1]);
console.log(s); //Set(2) {1, 2}
（2）字符串、arguments、NodeList、Set（Set实例）等
// 字符串
console.log(new Set("hi")); //Set(2) {'h', 'i'}
// arguments
function func() {
console.log(new Set(arguments)); //Set(2) {1, 2}
}
func(1, 2, 1);
//NodeList
console.log(new Set(document.querySelectorAll("p"))); //Set(3) {p, p, p}
//Set
const s = new Set([1, 2, 1]);
console.log(s); //Set(2) {1, 2}
console.log(new Set(s)); //Set(2) {1, 2}
console.log(new Set(s)===s); //false
2、Set的注意事项
（1）判断重复的方式：Set对重复值的判断基本遵循严格相等（===），但是对于NaN的判断与（===）不同，Set中NaN等于NaN
const s = new Set([NaN,2,NaN]);
console.log(s); //Set(2) {NaN, 2}
//判断对象是否相等，应当从地址出发，不是同一个地址，就算长得一样也可以添加
const s = new Set();
s.add({}).add({});
console.log(s); //Set(2) {{…}, {…}}
（2）什么时候使用Set（后两种使用数组或Set都是可以的，只是建议使用Set）
①当需要对数组或字符串去重时
②不需要通过下标访问，只需要遍历时
③为了使用Set提供的方法和属性时（add delete clear has forEach size等）
3、Set的应用（重要）
（1）数组去重
// 数组去重
// [1,2,1]
const s = new Set([1, 2, 1]);
console.log(s);
// 把Set转换为数组
// 方法1：使用forEach
// 方法2：只需要在数组中使用展开运算符
// console.log(...s); //1 2
console.log([...s]); //(2) [1, 2]
// 数组去重一步到位
console.log([...new Set([1, 2, 1])]); //(2) [1, 2]
（2）字符串去重
// 字符串去重
const s = new Set("abbacbd");
console.log([...s].join(''));
// 字符串去重一步到位
console.log([...new Set("abbacbd")].join("")); //abcd
（3）存放DOM元素
// 存放DOM元素
// console.log(document.querySelectorAll('p'));
// 以前的做法：使用for()循环
const s = new Set(document.querySelectorAll("p"));
console.log(s);
s.forEach(function (elem) {
elem.style.color = "red";
elem.style.backgroundColor = "yellow";
})
五、课程心得
今天学习了Set的参数、使用时的注意事项以及Set的应用，对Set相关知识的理解更加清晰，还再次对现今所学的去重知识进行了回顾，继续加油！