Set集合与Map集合

15 篇文章 0 订阅

一、Set集合

Set集合是一种数据结构,类似于数组。不能存放重复的值,通常用来做数组去重或字符串去重

创建set集合及常用方法:

(1)创建集合:new Set()
	
(2)常用方法:
	
	a、add():向集合中添加元素
		
	b、delete():删除元素
		
	c、has():判断集合中是否存在某个值
		
	d、clear():清除集合中所有元素
let set=new Set()
 
set.add(1)
set.add(2)
set.add(2)

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

console.log(set);  //输出:Set(4) { 1, 2, 12, 15 }
console.log(...set);  //输出:1 2 12 15
console.log([...set]);  //输出:[ 1, 2, 12, 15 ]

set.delete(15)  //返回true表示删除成功 false表示删除失败
console.log([...set]);

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

set.clear()
console.log(set);
(3)集合的遍历:Set集合中key和value是一样的,所以keys()和values()是一样的
	
	a、获取集合的keys或values进行遍历
		
	b、通过forEach进行循环
let set=new Set()
set.add('西安').add('咸阳').add('渭南').add('铜川')

for(let i of set.keys()){//keys()函数的作用:获取set中的所有的键(key),返回值也是集合
    console.log(i)
} 
console.log('------------------------')
for(let t of set.values()){ //values()函数的作用:获取set中的所有的值(value),返回值也是集合
    console.log(t)
}
console.log('------------------------')
//注意:Set中的key和vlaue是相同的,即keys()和values()的返回值是一样的

set.forEach(function(key){  //函数的两个参数的值是一样的

    //console.log(`${key}:${val}`);
    console.log(`${key}`)
})

在这里插入图片描述

(4)通过数组来构造一个Set集合
let arr=[11,22,33,44,55]

let set=new Set(arr)
console.log(set);

在这里插入图片描述

(5)通过Set实现集合的交集与并集
	
	    a、并集
		
		b、交集
let arr=[11,22,33,44,55,]
let list=[66,77,88,11,44]

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

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

//实现A和B的交集
let D=new Set([...A].filter(function(val){  //通过过滤器找到在A和B中都出现的元素
    if(B.has(val)){
        return val
    }
}))
console.log('A和B的交集:',...D);
console.log('D的元素个数:',D.size);  //size属性:用来表示元素个数

在这里插入图片描述

(6)WeakSet集合:只能存放对象,支持add、delete、has方法,但不支持size属性和keys()
let ws=new WeakSet()
ws.add({id:'1001',uname:'刘备'})
console.log(ws);

二、Map集合

(1)在ES5中没有Map,但是有object对象(采用hash结构:key-value),键(key)的数据类型只能是字符串
	
(2)ES6中增加了Map
	
	  A、属性:size 表示集合中的元素个数
	   
	  B、常用方法:
	   
	      a、set():添加数据
		  
		  b、get():获取数据
		  
		  c、has():判断某个key是否存在
		  
		  d、delete():删除key
		  
		  e、clear():清除所有的key
let map=new Map()

map.set('id',1001)
map.set('name','刘备')
map.set('age',25)

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

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

在这里插入图片描述

      C、遍历方法
	   
	      a、keys():返回map中的所有key
		  
		  b、values():返回map中的所有value
		  
		  c、entries():返回所有的map成员
		  
		  d、forEach():
		  
		  //函数带两个参数,第一参数对应key。第二个参数对应value;若函数只有一个参数则对应value
		  map.forEach(function(key,val){
		  
              console.log(`${key}:${val}`);
		   
          })
for(let key of map.keys()){
    //console.log(key);
    console.log(`${key}:${map.get(key)}`);
} 
console.log('------------------------')
 for(let val of map.values()){
    console.log(val);
}

console.log('------------------------')
for(let kv of map.entries()){
    console.log(kv);
} 
console.log('------------------------')
 for(let [key,value] of map.entries()){
    console.log(`${key}:${value}`);
} 
console.log('------------------------')

map.forEach(function(key,val){
    console.log(`${key}:${val}`);
}) 

在这里插入图片描述

        D、转换为数组:使用'...'运算符
		
		E:用filter过滤
//将key转换为数组
let k=[...map.keys()]  //输出:[ 'id', 'name', 'age' ]
console.log(k);

//将value转换成数组
let v=[...map.values()]  //输出:[ 1001, '刘备', 25 ]
console.log(v);

//将key-value转换为数组
//输出二维数组:
[
    [ 'id', 1001 ],
    [ 'name', '刘备' ], 
    [ 'age', 25 ]
]

let obj=[...map.entries()]  
console.log(obj);

在这里插入图片描述

let map=new Map()
map.set('101',15)
map.set('102',5)
map.set('103',150)
map.set('104',28)
map.set('105',19)
map.set('106',36)

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);

在这里插入图片描述

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值