ES6 Map

Posted 2020-11-22 jiaobaba

Map是ES6提供给我们的构造函数，本质上是键值对的集合。他和对象类似

特点：key对应value，key和value唯一，任何值都可以当属性（包括对象）。但在javascript的Object属性和值构成的是”字符串-值“对，属性只能是字符串，如果传个对象字面量作为属性名，那么会默认把对象转换成字符串，结果这个属性名就变成”[object Object]“。ES6提供了”值-值“对的数据结构，键名不仅可以是字符串，也可以是对象。它是一个更完善的Hash结构。

创建Map

1.创建一个空map

let map = new Map();

 

 

 

2.创建map并初始化时map和set不同，map只接收数组作为参数，并且数组成员还是一个个数组，其中包含两个元素，一个代表键，一个代表值

 

let map = new Map([["name","zwq"],[‘age‘,‘18‘],[‘sex‘,true],[{},‘对象也可以是属性名‘]]);
console.log(map);//Map(4) {"name" => "zwq", "age" => "18", "sex" => true, {…} => "对象也可以作为属性名"}

 

 

 

例如当你想把dom对象最为属性名时，在Object里作为属性名是会被toString的{[object htmlDivElement]: 20}，这是你就可以使用map会这样存下div.wrapper => "20"}

使用api添加值和取值

 

map.set(‘name‘,‘zwq‘);
map.set(‘age‘,‘20‘);
console.log(map.get(wrapper));  20
console.log(map.get({}));     //undedinde 因为当前的对象不是之前的那个对象了，你需要把对象用变量存一下。

 

 

 

delete() 删除键值对。

clear() 清空map

size()  返回map的长度

keys() 返回所有的属性名

has(‘属性名‘) 看map里面有没有属性 返回true，false

遍历map

 

方法一
map.forEach(function(ele,key,self){
    console.log(ele,key,self);      //true "sex" Map(1) {"sex" => true}
})
方法二
for(var prop of map){
    console.log(prop);       //返回把键值对变成数组 ["name", "zwq"] ["age", "20"]
　　
　　console.log(prop[0],prop[1]);  拿到属性名，属性值

}