总结一些日常需要用到的一些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的方法自动的完成对数据的去重。
最后
整理了一套《前端大厂面试宝典》,包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法,一共201道面试题,并对每个问题作出了回答和解析。
有需要的小伙伴,可以点击文末卡片领取这份文档,无偿分享
部分文档展示:
文章篇幅有限,后面的内容就不一一展示了
有需要的小伙伴,可以点下方卡片免费领取