set和map的总结

一、简介

Set类似于数组，但是它里面每一项的值是唯一的，没有重复的值，Set是一个构造函数，用来生成set的数据结构。

const arr = [1, 2, 3, 4, 5, 5, 4, 3, 2, 1];

const set = new Set();

arr.forEach(item => set.add(item));

console.log(set); // 1, 2, 3, 4, 5

console.log(typeof set) //object

 

// 数组快速去重

console.log([...new Set(arr)]); //[1, 2, 3, 4, 5]

需要注意的是，set是一个对象，当使用...之后可以转化为数组

Map类似于JSON对象，也是键值对的集合，但是“键”的范围不限制于字符串，各种类型的值（包含对象）都可以当作键。Map 也可以接受一个数组作为参数，数组的成员是一个个表示键值对的数组。注意Map里面也不可以放重复的项。

var map = new Map();

var obj = { name: '小缘', age: 14 };

map.set(obj, '小缘喵');

console.log(map) //Map(1) {{{name: "小缘", age: 14}} => "小缘喵"},也就是说键名可以是对象

 

map.get(obj); // 小缘喵

map.has(obj); // true

map.delete(obj) ;// true

map.has(obj); // false

二、操作

set的方法：通过add(key)方法可以添加元素到Set中，可以重复添加，但不会有效果

　　          通过delete(key)方法可以删除元素

　　　　    has(value)：判断集合中是否存在 value

　　　　    clear()：清空集合

map的方法:

var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); // 67
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined
m.clear()将这个字典中的所有元素删除

下面着重讲一下set可以操作实现的一些例子

数组的并集

let arr1 = [1,2,3]; 

let arr2 = [3,4,5]; 

let s1 = new Set([...arr1,...arr2]) //这样就把重复的3去掉了

console.log([...s1]);//这就是并集的结果了

数组的交集

let arr1 = [1,2,3,1]; 

let arr2 = [3,4,5,4]; 

let s1 = new Set(arr1);//先去除arr1数组自身的重复项 

let s2 = new Set(arr2);//去除arr2数组自身的重复项

//先简单介结一个数组的filter方法，它是es5的方法，它的参数是一个函数，如果这个函数返回的是true， 

//表示把数组的这一项留下，如果是false的话，会把数组的这一项删除掉

let arr = [...s1].filter((item)=>{

　　return s2.has(item) //has方法看s2里有没有item这一项

})

console.log(arr)//[3]

数组的差集

//将上述的代码修改一下就好

let arr = [...s1].filter((item)=>{

　　return !s2.has(item) //重点在这里，就是把咱们的交集取个反就ok了

})

三、区别

 

• Set 和 Map 主要的应用场景在于 数据重组 和 数据储存。
• Set 是一种叫做集合的数据结构，Map 是一种叫做字典的数据结构

 

     集合 与 字典 的区别：

• 共同点：集合、字典 可以储存不重复的值
• 不同点：集合 是以 [value, value]的形式储存元素，字典 是以 [key, value] 的形式储存