ES6的Map数据结构

ES6的Map数据结构

含义和基本用法

JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键。。如果键名不是字符串的话，将会被自动转为字符串，这对我们的使用会造成一定的限制。所以ES6中提供了Map数据结构，其提供了“值—值”的对应，是一种更完善的Hash结构实现，如果我们需要“键值对”的数据结构，Map比Object更合适。

Map本身也是构造函数，初始化一个Map数据结构就可以用如下方式：

const map = new map();

当然，Map也可以接受一个数组作为参数，该数组的成员是一个个表示键值对的数组。也可以使用任何具有 Iterator 接口、且每个成员都是一个双元素的数组的数据结构都可以当作Map构造函数的参数。这就是说，Set和Map都可以用来生成新的 Map。如下所示：

//数组作为参数
const map = new Map([
['name', '张三'],
['title', 'Author']
]);

//Set数据结构作为参数
const set = new Set([
  ['foo', 1],
  ['bar', 2]
]);
const m1 = new Map(set);
m1.get('foo') // 1

//Map数据结构作为参数
const m2 = new Map([['baz', 3]]);
const m3 = new Map(m2);
m3.get('baz') // 3

注意：如果对同一个键进行多次赋值，后面的值将会覆盖前面的值。但只有对同一个对象的引用，Map结构才会将其视为同一个键。由此可知，Map的键其实是跟内存地址绑定的，只要内存地址不一样，就会被视为两个键。但如果 Map 的键是一个简单类型的值（数字、字符串、布尔值），则只要两个值严格相等，Map 将其视为一个键，比如0和-0就是一个键，布尔值true和字符串true则是两个不同的键。另外，undefined和null也是两个不同的键。虽然NaN不严格相等于自身，但 Map 将其视为同一个键。

实例的属性和操作方法

size属性

该属性返回Map结构的成员总数

const map = new Map();
map.set('foo', true);
map.set('bar', false);
map.size // 2

set方法

Map.prototype.set(key, value)

该方法设置键名key对应的键值为value，然后返回整个Map结构。如果key已经有值，则更新当前键值。同时由于该方法返回值依然是当前的Map对象，所以可以采用链式写法。示例如下：

let map = new Map()
.set(1, 'a')
.set(2, 'b')
.set(3, 'c');

get方法

Map.prototype.get(key)

读取当前key对应的键值，如果没有，则返回undefined。

has方法

Map.prototype.has(key)

该方法返回一个布尔值，表示某个键是否在当前Map对象之中。

delete方法

Map.prototype.delete(key)

该方法用于删除某个键，删除成功返回true，否则返回false。

clear方法

该方法用于清除所有成员，但没有返回值！

遍历方法

Map 结构原生提供三个遍历器生成函数和一个遍历方法。

• Map.prototype.keys()：返回键名的遍历器。
• Map.prototype.values()：返回键值的遍历器。
• Map.prototype.entries()：返回所有成员的遍历器。
• Map.prototype.forEach()：遍历 Map 的所有成员。

需要特别注意的是，Map 的遍历顺序就是插入顺序。而且Map 结构的默认遍历器接口（Symbol.iterator属性），就是entries方法。

Map 结构转为数组结构，比较快速的方法是使用扩展运算符（...）。再综合数组的map方法、filter方法，就可以实现Map的遍历和过滤。

const map = new Map([
  [1, 'one'],
  [2, 'two'],
  [3, 'three'],
]);

[...map.keys()]
// [1, 2, 3]

[...map.values()]
// ['one', 'two', 'three']

[...map.entries()]
// [[1,'one'], [2, 'two'], [3, 'three']]

[...map]
// [[1,'one'], [2, 'two'], [3, 'three']]

此外，forEach方法也可以实现Map的遍历，还可以接受第二个参数，用来绑定this。如下例所示，forEach方法的回调函数的this，就指向reporter。

const reporter = {
report: function(key, value) {
console.log("Key: %s, Value: %s", key, value);
}
};
map.forEach(function(value, key, map) {
this.report(key, value);
}, reporter);

Map也可以和其他数据结构例如数组、对象、JSON相互转换，具体情况可以参照官方文档进行深入学习。

WeakMap

WeakMap结构与Map结构类似，也是用于生成键值对的集合。但是WeakMap只接受对象作为键名（null除外），不接受其他类型的值作为键名。其次，WeakMap的键名所指向的对象，不计入垃圾回收机制。基本上，如果你要往对象上添加数据，又不想干扰垃圾回收机制，就可以使用 WeakMap。WeakMap 应用的典型场合就是 DOM 节点作为键名。

如需了解更多详细知识，可以参考官方文档。

本文仅作为个人学习总结，如有错误，欢迎指出。