[前端攻坚]：Set的使用

theme: smartblue
highlight: foundation

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第10天，点击查看活动详情

总结一些日常需要用到的一些api，也是在一些面试中会经常出现的题目，今天分享的是Set的一些用法和个人的一些理解， 同时文章也被收录到我的《JS基础》专栏中，欢迎大家点击收藏加关注。

我们知道Set是一种叫做集合的数据结构，Map是一种叫做字典的数据结构，他们的共同点是set和map都是存储的不会重复的值，利用好这一点可以很好的做一些数组去重和对象数组的区中，他们的不同点是存储形式上的不同，集合是以[值，值]的形式存储元素，字典是以[键，值]的形式存储。

认识set

类似于数组，但是成员的值都是唯一的，没有重复的值

1. set()
2. has()

先看下简单的调用

1. set 用来设置键和值
2. has 判断是否存在某个值
3. size 返回set中的个数
4. clear 清空set

const s = new Set();
s.add(1)
console.log(s) //Set(1) { 1 }
s.add(1).add(2).add(2) 
console.log(s) //Set(2) { 1, 2 }
console.log(s.has(2)) //true
n.clear()
n.size // 0

基本使用

1. 可以使用add来对set设置值，并且可以使用链式操作来进行设置
2. 键可以是任意数据类型
3. 每个值在 Set 的集合中是独一无二的

const s = new Set();

let c = {c:1}
s.add({a:1}).add(2).add(2).add({a:1}).add(c).add(c); //Set(4) { { a: 1 }, 2, { a: 1 }, { c: 1 } }
console.log(s);
console.log(s.size)

对set设置值之后可以看到重复设置的会被过滤掉，但是{a:1}是没有被过滤出来的，因为本身是一个对象，就算对象中的属性和值都一样，都存储了不同的指针，所以两个对象都是不相等的

应用场景

从这里我们可以看出set的存储类型和数组的存储非常相似，都是通过值的方式存储，并且可以通过遍历输出，针对于不会重复的这个特点，set的应用场景可以放在对数组进行去重的场景下

对于map的应用场景，可以放到实现深拷贝中进行使用，存储对象中的复杂数据类型

var arr = [1,1,13,4,4,5,6,77,8,8,9]
console.log(...new Set(arr)) //1 13 4 5 6 77 8 9

set可以理解是一个数组的形式，那么同样可以用rest对他进行展开，而且可以传入可以数组，通过newset的方法自动的完成对数据的去重。