Javascript Map 对象使用说明

Map 是 ES6 中引入的一种新的数据结构，对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。以前用的JS对象 Object也是可以把其属性看作键来定位数据，但 Map 和 Object 是有区别的。

Map 和 Object 区别

比较项	Object	Map
键的范围	键只能是字符串或者 Symbols	可以是任意值，包括对象与函数
键的顺序	键（属性）是无序的	键值是有序的（FIFO 原则）
键值统计	键值对个数只能手动计算	键值对个数可以从 size 属性获取
键名冲突	原型链上的键名有可能和你自己在对象上的设置的键名产生冲突	不会冲突

创建 Map

使用 Map 类型和 new 关键字来创建 Map；初始化 Map，可以以数组的格式来传入键值对。

// 使用new
let myMap = new Map();

// 使用数组来初始化
let myMap = new Map([
        ["key1", "value1"],
        ["key2", "value2"]
    ]); 

Map 相关的属性与方法

名称	意义
clear()	移除 Map 对象的所有键/值对
set()	设置键值对，返回该 Map 对象
get()	返回键对应的值，如果不存在，则返回 undefined
has()	返回一个布尔值，用于判断 Map 中是否包含键对应的值
delete()	删除 Map 中的元素，删除成功返回 true，失败返回 false
size	注意，这个是属性，返回 Map 对象键/值对的数量
keys()	返回一个 Iterator 对象， 包含了 Map 对象中每个元素的键
values()	返回一个新的Iterator对象，包含了Map对象中每个元素的值

示例

let nameSiteMapping = new Map();
 
// 设置 Map 对象
nameSiteMapping.set("Google", 1);
nameSiteMapping.set("Runoob", 2);
nameSiteMapping.set("Taobao", 3);
 
// 获取键对应的值
console.log(nameSiteMapping.get("Runoob"));     // 2
 
// 判断 Map 中是否包含键对应的值
console.log(nameSiteMapping.has("Taobao"));       // true
console.log(nameSiteMapping.has("Zhihu"));        // false
 
// 返回 Map 对象键/值对的数量
console.log(nameSiteMapping.size);                // 3
 
// 删除 Runoob
console.log(nameSiteMapping.delete("Runoob"));    // true
console.log(nameSiteMapping);
// 移除 Map 对象的所有键/值对
nameSiteMapping.clear();             // 清除 Map
console.log(nameSiteMapping);
// 迭代
let nameSiteMapping = new Map();
 
nameSiteMapping.set("Google", 1);
nameSiteMapping.set("Runoob", 2);
nameSiteMapping.set("Taobao", 3);
 
// 迭代 Map 中的 key
for (let key of nameSiteMapping.keys()) {
    console.log(key);                  
}
 
// 迭代 Map 中的 value
for (let value of nameSiteMapping.values()) {
    console.log(value);                 
}
 
// 迭代 Map 中的 key => value
for (let entry of nameSiteMapping.entries()) {
    console.log(entry[0], entry[1]);   
}
 
// 使用对象解析
for (let [key, value] of nameSiteMapping) {
    console.log(key, value);            
}

forEach

var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");
 
// 将会显示两个 logs。 一个是 "0 = zero" 另一个是 "1 = one"
myMap.forEach(function(value, key) {
  console.log(key + " = " + value);
}, myMap)

Map 与 Array的转换

var kvArray = [["key1", "value1"], ["key2", "value2"]];
 
// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
var myMap = new Map(kvArray);
 
// 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
var outArray = Array.from(myMap);