JS里面Map的使用以及与Object的对比

Map vs Object

顺序

Object：它的对象属性是无序的，或者是说不保证有序。

Map：它的键值对是按照插入的顺序存储的，是有序的。

键的类型

Object的键是字符串或Symbol类型。

Map的键可以是任意类型。

性能

Object在频繁增删时候性能不如Map。

迭代方式

Object不能通过for...of迭代，只能通过Object.keys(obj)或者Object.values(obj) 后进行迭代。

javascript 复制代码

const obj = { a: 1, b: 2, c: 3 };
for (let key of Object.keys(obj)) {  
    console.log(key, obj[key]);
}
// output
// a 1
// b 2
// c 3
for (let val of Object.values(obj)) {  
    console.log(val);
}
// output
// 1
// 2
// 3

Map可以通过for...of迭代。也可以通过map.keys(), map.values(), map.entries() 或者键、值、键值对进行迭代。

javascript 复制代码

const map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);
for (let [key, value] of map) {  
    console.log(key, value);
}
// output
// a 1
// b 2
// c 3

与JSON的结合

Object 和JSON能够很好地映射，不需额外的操作。

Map在转JSON方面就没那么友好。上面也提到了，Map的键值是可以任意类型的，所以它不能正确返回JSON格式。需要额外处理。

Map 提供了几个built-in的方法

set(key, val) 添加或更新键值元素。

get(key) 返回键对应的值。

delete(key) 删除键值对应的元素。

has(key) 判断是否存在该键。

clear() 清空所有元素。

size 返回元素数量。

keys() 返回可迭代的所有键列表。

values() 返回可迭代的所有的值列表。

entries() 返回可迭代的键值对列表。

总结

针对不同的使用场景，可以选择不同的方式，如果需要更加关注性能，需要频繁插入和删除元素，需要非字符串作为键的话，选用Map。否则可以选择Object即可。