遍历方法
Map 提供了3个遍历器生成函数和一个遍历方法。其中 Map.prototype.keys() 是返回键名的遍历器,Map.prototype.values() 是返回键值的遍历器,Map.prototype.entries() 是返回成员的遍历器,Map.prototype.forEach() 是遍历成员的方法。
需要注意的是 Map 遍历的时候是按照插入的顺序进行遍历的。
const map = new Map([
["first", true],
["second", false],
]);
for (const key of map.keys()) {
console.log(key); // first second
}
for (const value of map.values()) {
console.log(value); // true false
}
for (const [k, v] of map.entries()) {
console.log(k, v); // first true
// second false
}
const obj = {
print: function (key, value) {
console.log(key, value); // first true
// second false
},
};
map.forEach(function (value, key,map) {
this.print(key, value);
}, obj);
上面演示了 keys(),values() 和 entries() 的使用场景,由于返回的是遍历器,可以通过 for...of 遍历里面的值。
forEach() 方法类似于数组的 forEach(),可以在每次遍历的过程中输出 value,key,map。此外 forEach() 方法还提供第二个参数,用于指定回调函数中的 this 指向,例子中的 this.print() 就是指向了 obj 里面的 print 方法。
同其他数据结构进行互相转换
Map 同数组互相转换很方便,Map 构造函数支持传入一个数组,通过扩展运算符可以很方便的将 Map 转成数组。
const map = new Map([
[1, true],
[2, false],
]);
console.log([...map]); // [ [ 1, true ], [ 2, false ] ]
Map 也可以和对象进行相互转换,为了实现对应的转换需要借助 Object.entries() 和 map.entries()
const map = new Map(Object.entries({ 1: true, 2: false }));
console.log(map); // Map(2) { '1' => true, '2' => false }
function mapToObj(map) {
let obj = Object.create(null);
for (const [key, value] of map.entries()) {
obj[key] = value;
}
return obj;
}
console.log(mapToObj(map)); // [Object: null prototype] { '1': true, '2': false }
需要注意的是,这里面是用了 Object.create(null) 创建新对象,它类似一个新的 Map,里面值不会受到 Object.prototype() 原型的干扰。
const obj1 = {};
console.log(obj1.toString()); // [object Object]
const obj2 = Object.create(null);
console.log(obj2.toString()); // TypeError: obj2.toString is not a function
小结
本文先是介绍了 Map 的 keys(),values(),entries() 生成器函数和 forEach() 方法,注意 forEach() 方法的第二个参数可以第一个回调函数参数的 this 指向。接着介绍了数组,对象与 Map 的相互转换,注意对象的键只能是字符串,而数组没有要求。