Map相关方法

1.Map

ES6引入Map数据结构，键值对的集合，本质上Map就是一个Object对象

2.相关方法

2.1 Map.set()

为数据类型 Map 赋值的方法 map.set(key,value)，可以用于增加新的键/值对或者修改键/值对，返回整个 Map 对象

const page_info = new Map()
// 设置值
page_info.set("seo", {
    "keywords": "infoq、Map",
    "description":"Map对象是一种简单的键/值映射，其中的键和值可以是任意值（原始值或对象的值）"
});
console.log(page_info);
page_info.set("seo", "seo信息");
console.log(page_info);
//输出结果
Map {
  'seo' => {
    keywords: 'infoq、Map',
    description: 'Map对象是一种简单的键/值映射，其中的键和值可以是任意值（原始值或对象的值）'
  }
}
Map { 'seo' => 'seo信息' }

2.2 Map.get()

使用 get(key) 获取键值，如果获取的 key->value 不存则返回 undefined

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
const title = page_info.get("title");
const seo_info = page_info.get("seo");
console.log(title);      // javascript es6的map映射
console.log(seo_info);   // undefined

2.3 Map.delete()

map.delete(key) 删除指定 key 的键值对，返回成功或失败结果，删除成功返回 true，删除失败返回 false

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");
console.log(page_info);         // Map { 'title' => 'javascript es6的map映射', 'author' => 'infoq' }

const deleted_author = page_info.delete("author");
const deleted_seo = page_info.delete("seo");
console.log(deleted_author);   // true
console.log(deleted_seo);      // false
console.log(page_info);

2.4 Map.has()

判断指定key是否存在

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
console.log(page_info);         // Map { 'title' => 'javascript es6的map映射' }

console.log(page_info.has("title"));   // true
console.log(page_info.has("seo"));     // false

2.5 Map.values()

获取所有键的值

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");
console.log(page_info.values());       // [Map Iterator] { 'javascript es6的map映射', 'infoq' }

2.6 Map.entries()

返回一个新的包含 [key, value] 对的 Iterator 对象，返回的迭代器的迭代顺序与 Map 对象的插入顺序相同

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");
console.log(page_info.entries());
//输出结果
[Map Entries] {
  [ 'title', 'javascript es6的map映射' ],
  [ 'author', 'infoq' ]
}

2.7 Map.clear()

移除Map对象中的所有元素

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");
page_info.clear();
console.log(page_info);  // Map {}

2.8 数据转换

2.8.1 转为数组

const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");
console.log([...page_info]);  // [ [ 'title', 'javascript es6的map映射' ], [ 'author', 'infoq' ] ]

2.8.2 转为Object

function mapToObj(map) {
    const obj = Object.create(null);
    map.forEach((v,k)=>{
        obj[k] = v;
    });
    return obj;
}
const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");

console.log( mapToObj(page_info));
//输出结果
[Object: null prototype] {
  title: 'javascript es6的map映射',
  author: 'infoq'
}

2.8.3 转为JSON

Map 转为 JSON ，步骤是先把 Map 转为对象，即前面的 mapToObj，然后使用 JSON.stringify 方法，如下：

function mapToObj(map) {
    const obj = Object.create(null);
    map.forEach((v,k)=>{
        obj[k] = v;
    });
    return obj;
}
function mapToJson(map){
    return JSON.stringify(mapToObj(map));
}
const page_info = new Map();
page_info.set("title", "javascript es6的map映射");
page_info.set("author", "infoq");
console.log( mapToJson(page_info));   // {"title":"javascript es6的map映射","author":"infoq"}

2.8.4 对象转Map

对象转为 Map 映射通过 Object.entries()

const page_info = {
    title:"javascript es6的map映射",
    author:"infoq"
};
console.log(new Map(Object.entries(page_info)));  // Map { 'title' => 'javascript es6的map映射', 'author' => 'infoq' }

2.8.5 数组转Map

将数组传入 Map 构造函数即可，即 new Map(array)，如下：

const page_info = [
    ["title","javascript es6的map映射"],
    ["author","infoq"]
];
console.log(new Map(page_info)); // Map { 'title' => 'javascript es6的map映射', 'author' => 'infoq' }