ES6新增的两种数据结构:Set和Map

Map和Set是ES6新增的两个数据类型;都是属于内置构造函数;使用new的方式来实例化使用
Set的概念和声明:
Set是一种数据的集合,类似数组,使用内置构造函数方式声明,只能接受数组,最大的特点就是去重,不允许接受重复的数据
Set的常用属性和方法
size 属性 获取该数据结构中,数据的数据个数
add() 方法 向该数据结构中,追加新增数据
delete() 方法 向该数据结构中,删除指定的数据
clear() 方法 清除该数据结构中,所有的数据
has() 方法 查询数据结构中,有没有某个数据
forEach() 方法 用来遍历Set数据结构
注意: Set数据的获取需要借助展开运算符,并放在数组中才能解析
下面是测试代码:

		var s = new Set(["hello",3,4,5,6,7,2,3,4,"world","7"]);
		
		console.log(s); //Set(8) {"hello", 3, 4, 5, 6, …}
		
		console.log(typeof s); //object
		
		console.log(s[0]);//undefined,没有索引,不能够通过索引拿到数据
		
		console.log(s.length); //undefined,没有长度
		
		// 有大小:size属性
		console.log(s.size); //8
		
		// 可以遍历,遍历方式:forEach()是set原型身上的方法,与数组中的forEach不同
		// forEach()三个参数,值,索引,自身,注意这里的索引与值相同,并不是真正的索引
		s.forEach(function(val,idx,self){
			console.log(val,idx,self);
		})
		
		// 删除:delete()方法
		s.delete("hello");
		
		// 判断是否有某个值:has()方法
		console.log(s.has(5)); //true表示有
		
		// 清空:clear()方法
		s.clear();
		console.log(s); // Set(0) {},清空之后Set中没有数据
		
		// 添加:add()方法
		s.add("abc");
		console.log(s);// Set(1) {"abc"},给Set中添加了一个数据
		
		// 如果要获取set中的某一个数据,需要先解析回数组(使用ES6中的语法...展开数组)
		var arr = [...s]; // 将解析的结果放到一个数组中
		console.log(arr); // ["abc"]

使用forEach()方法遍历的结果示例:
在这里插入图片描述
forEach()的参数说明:
第一个数据表示值val,第二个数据表示索引idx(key),第三个数据表示map中传入的数据(这里的索引和值相同)
注意: 这里的结果是去重重复的数据之后的结果,并且这里去重使用的是严格等于
使用Set实现数组去重:

function norepeat(arr){
			var s = new Set(arr);
			return [...s];
		}
		
		var a = norepeat([2,3,4,5,6,7,5,9,3,8,"7"]);
		console.log(a);//这里去重使用的是严格等于

去重后的结果:
在这里插入图片描述
Map概念和声明:
Map是数据的集合,类似对象,使用内置构造函数声明
Map结构(集合):只能接受数组,而且是二维数组,并且第二维数组中只能有两个数据,如果有多个,不解析
第二维数组的第一个数据被解析成了key,第二维数组的第二个数据被解析成了val
测试代码:

var m = new Map([["hello","world"],["a","b","c"],[2,3]]);
		
		console.log(typeof m);
		
		console.log(m);
		
		console.log(m.hello);//undefined,虽然结构长得跟对象一样,但是并不是对象,不能使用对象的方法获取数据
		
		// 大小:size属性
		console.log(m.size);//3
		
		// 遍历,与set类似,但这里的值和索引不一样,值是val,索引是idx
		m.forEach(function(val,idx,self){
		        console.log(val,idx,self)
		    })
			
		// 删除:m.delete("idx")
		m.delete("hello");
		
		// 清除所有:
		// m.clear();
		
		// 是否有某个数据,根据idx,即:第二维数组的第一个数据
		// 使用has()方法,有返回true,没有返回false
		console.log(m.has("a"));//true
		
		console.log(m.has("hello"));//false
		
		console.log(m.has("world"));//false
		
		// 添加数据:set()方法
		m.set("hahhh","heiheie")
		
		// 单独查询数据:get()方法
		console.log(m.get("a"));//b
		
		console.log(m);//Map(3) {"a" => "b", 2 => 3, "hahhh" => "heiheie"}

forEach()方法遍历的结果:
在这里插入图片描述
forEach()的参数说明:
第一个数据表示值val,第二个数据表示索引idx(key),第三个数据表示map中传入的数据

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值