ES6- Map-1介绍及常用api

时间:2022-07-25
本文章向大家介绍ES6- Map-1介绍及常用api,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

ES6- Map-1介绍及常用api

Map简介

  1. ES6提供的构造函数,一种新的存储结构,本质是键值对的集合
  2. 特点:key对应value,key和value唯一,任何值都可以当key
  3. 用途:可以让对象去当属性,去重
  4. 原理实现: 链接链表, hash算法, 桶

Map对象的创建

  • 初始化默认赋值,需放入数组
	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	console.log(oMap);
  • 直接创建
	let oMap = new Map();
	console.log(oMap);

Map-api介绍

1. add() 往Map中添加键值对

其中还可以添加对象和dom元素

	let oMap = new Map();
	oMap.set("name","www");
	oMap.set("age",19);
	oMap.set("sex", true);
	// 再添加一般的值以后,我们甚至可以把dom元素放进去当key
	let oDiv = document.getElementById("demo");
	oMap.set(oDiv, 50);
	console.log(oMap);

2. get() 根据key取value

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	// 当然,如果直接放入空对象当键是取不到的,因为每一次都是重新new一个出来
	console.log(oMap.get("name"));

3. delete() 根据key删除键值对

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	oMap.delete("name");
	console.log(oMap);

4. keys() 获取所有的key

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	console.log(oMap.keys());

5. values() 获取所有的value

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	console.log(oMap.values());

6. has() 判断map是否具有某个key

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	console.log(oMap.has("name"));

7.clear() 清空Map

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	oMap.clear();
	console.log(oMap);

8.size() 获取Map的长度

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	console.log(oMap.size);

9.entries() 相当于获取创建的对象本身

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	console.log(oMap.entries());

10.Map的遍历方法

1采用forEach()方法
	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	oMap.forEach((ele, key, self) => {
	    console.log(ele, key, self);
	})

2 采用for of 循环

	let oMap = new Map([["name", "www"],["age", 18],["sex", 20],[{}, 20]]);
	for(let prop of oMap){
	    console.log(prop[0], prop[1]);
	}