ES6- Map-1介绍及常用api
ES6- Map-1介绍及常用api
envoke
发布于 2020-09-17 11:26:14
发布于 2020-09-17 11:26:14
ES6- Map-1介绍及常用api
Map简介
- ES6提供的构造函数，一种新的存储结构，本质是键值对的集合
- 特点：key对应value，key和value唯一，任何值都可以当key
- 用途：可以让对象去当属性，去重
- 原理实现： 链接链表， 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]);
}
在这里插入图片描述
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2019-04-24 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录