JavaScript------Set集合和Map集合

一、Set集合

Set集合是一种数据结构，类似于数组，但是不能存放重复的值 可以理解为Set 中的值总是唯一的。通常用于数组去重和字符串去重。

1、 创建集合

创建一个新的 Set 对象： new Set()

2、 常用方法:

        ⭐ add() :向集合中添加元素；

        ⭐ delete() :删除元素；

        ⭐ has() :判断集合中是否存在某个值；

        ⭐ clear() :清除集合中的所有元素。

let set =new Set
 set.add(1)
 set.add(2)
 set.add(1)

 set.add(3).add(12).add(15)

 console.log(set);//Set(5) { 1, 2, 3, 12, 15 }
 console.log(...set);//1 2 3 12 15
 console.log([...set]);//[ 1, 2, 3, 12, 15 ]

 set.delete(12)
 console.log(set);//Set(4) { 1, 2, 3, 15 }

 console.log(set.has(12));//false  判断集合中是否存在12
 console.log(set.has(15));//true  判断集合中是否存在15

set.clear()//清除集合中的所有元素
console.log(set);//Set(0) {}

3、集合元素的遍历

Set集合中key和value是相同的，所以 keys() 和 values() 是一样的。

                ⭐获取集合的 keys() 和 values() 进行遍历；

                ⭐通过 forEach() 循环。

//遍历
 for(let i of set.keys()){//keys()函数的作用：获取set中的所有键（key）返回值也是个集合
    console.log(i);
 }
console.log('----------');
 for(let i of set.values()){//values()函数的作用：获取set中的所有值（value）返回值也是个集合
    console.log(i);
 }
 //注意:Set中的key和value是相同的，即keys()和values()的返回值是一样的
 console.log('----------');
 //forEach循环遍历
 set.forEach(e=>{
    console.log(e);
 })

 

4、 通过数组来构造一个Set集合

 let arr=[11,22,33,44,55]
 let set1=new Set(arr)
 console.log(set1);//Set(5) { 11, 22, 33, 44, 55 }

5、通过Set实现集合的并集和交集

               ⭐并集；

//通过Set实现集合的并集和交集
 let arr =[1,2,3,4,5]
 let list = [4,5,6,7,8]

 let A=new Set(arr)
 let B=new Set(list)

 //并集
 let C=new Set([...A,...B])//A和B的并集
 console.log('A集合',...A);
 console.log('B集合',...B);
 console.log('C集合',...C);

                ⭐交集。

//通过Set实现集合的并集和交集
 let arr =[1,2,3,4,5]
 let list = [4,5,6,7,8]

 let A=new Set(arr)
 let B=new Set(list)

 //交集
 let D=new Set([...A].filter(val=>B.has(val)))//通过filter拿到符合条件的值
 console.log('A集合',...A);
 console.log('B集合',...B);
 console.log('D集合',...D);

  

6、WeakSet集合 

           WeakSet集合只能存放对象，支持 add() ， delete() ， has() ,不支持size和keys()。

let ws = new WeakSet()
let jack ={
    uname:'jack',
    age:21
}
ws.add(jack);
console.log(ws.has(jack));//true
ws.delete(jack)
console.log(ws.has(jack));//false

 

二、Map集合

在ES5中没有MAP，但是有object对象(采用hash结构:key-value)，键(key)的数据类型只能是字符串。

const map1 = new Map();

map1.set('a', 1);
map1.set('b', 2);
map1.set('c', 3);

console.log(map1.get('a'));//1

ES6中增加了Map。

1、属性

      size() 表示集合中元素的个数。

2、常用方法

                    ⭐ set() :添加数据；

                    ⭐ get() :获取参数；

                    ⭐ has() :判断某个key是否存在；

                    ⭐ delete() :删除key；

                    ⭐ clear() :清除所有的key。

let map = new Map()//创建Map

map.set('id', 1001)//set(key,value)
map.set('name', 'andy')
map.set('age', 10)

console.log(map.size);//3
let n = map.get('name')
console.log(n);//andy

console.log(map.has('age'));//true

map.delete('id')
console.log(map.has('id'));//false

map.clear()
console.log(map);//Map(0) {}

3、遍历方法

                    注意:Map的遍历顺序就是插入顺序。

                   ⭐ keys() :获取Map的所有key；

                    ⭐ values() :获取Map的所有值；

                    ⭐ entries() :获取Map的所有成员；

                    ⭐ forEach() :遍历Map的所有成员。

const map = new Map([
    ['F', 'no'],
    ['T', 'yes']
]);

for (let key of map.keys()) {
    console.log(key);//F//T   
}

for (let value of map.values()) {
    console.log(value);//no//yes    
}

for (let entry of map.entries()) {
    console.log(entry);//[ 'F', 'no' ]//[ 'T', 'yes' ]    
}

for (let [key, val] of map.entries()) {
    console.log(`${key}:${val}`);//F:no//T:yes  
}

map.forEach(function (key, val) {
    console.log(`${key}:${val}`);//no:F//yes:T  
});
 //函数带两个参数,第一个对应key,第二个参数对应value;若函数只有一个参数则对应value

               

4、转化为数组

将Map集合转为数组可以使用'...'运算符。

let map = new Map()//创建Map

map.set('id', 1001)//set(key,value)
map.set('name', 'andy')
map.set('age', 10)
map.set('address', '小沛')

//讲key转化成数组
let k = [...map.keys()]
console.log(k);//[ 'id', 'name', 'age', 'address' ]

//将value转化为数组
let v = [...map.values()]
console.log(v);//[ 1001, 'andy', 10, '小沛' ]

//将key-value转化为数组
let obj = [...map.entries()]
console.log(obj);
// [
//     [ 'id', 1001 ],
//     [ 'name', 'andy' ],
//     [ 'age', 10 ],
//     [ 'address', '小沛' ]
//   ] 

5、对Map中的元素进行过滤

对Map中的元素进行过滤可以使用过滤器 filter() 。

let map = new Map()
map.set('101', 5)
map.set('102', 12)
map.set('103', 25)
map.set('104', 39)
map.set('105', 46)
map.set('106', 58)
console.log(map);
//将map中value是偶数的键值对(key-value)过滤出来，存入一个新的map中

let map1 = new Map([...map].filter(function ([key, val]) {
    if (val % 2 == 0) {
        return [key, val]
    }
}))
console.log(map1);//Map(3) { '102' => 12, '105' => 46, '106' => 58 }