持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第10天，点击查看活动详情
前言
在ES6之前，我们都知道定义对象可以通过Object构造函数。但其具有一定的局限性，ES6的Map数据结构作为对Object的补充与扩展，使得对象的定义的准确性与完整性得到进一步提升。下面，我们便来看看Map数据结构有什么特性，相较于Object又有哪些差异吧。
Map数据结构
什么是Map
Map是一种类似于对象的结构，键名可以是任意类型。定义的方式为const a=new Map()
//可以看到a的键名可以是任意类型
let a=new Map([[1,"hello"],["b","world"],[Symbol('c'),"nihao"],[true,"shijie"],[undefined,"!"],[null,"!"],[NaN,"!"]])
//遍历输出a的键名与键值
for (const iterator of a.entries()) {
console.log(iterator)
}
/* [ 1, 'hello' ]
[ 'b', 'world' ]
[ Symbol(c), 'nihao' ]
[ true, 'shijie' ]
[ undefined, '!' ]
[ null, '!' ]
[ NaN, '!' ] */
Map实例的属性
Map.prototype.constructor：构造函数，默认就是Map函数通过new Map()调用。Map.prototype.size：返回Map实例的成员总数。
Map实例的方法
Set 实例的方法分为两大类：操作方法（用于操作数据）和遍历方法。下面先介绍四个操作方法。
Map实例的操作方法
Map.prototype.set(key,value)：添加某个成员，返回Map结构本身。Map.prototype.get(key)：读取key对应的键值，如果找不到key，返回undefined。Map.prototype.delete(key)：删除某个键，返回一个布尔值，表示删除是否成功。Map.prototype.has(key)：返回一个布尔值，表示该键是否为Map的成员。Map.prototype.clear()：清除所有成员，没有返回值。
Map实例的遍历方法
需要注意的是，Map的遍历顺序即为插入的顺序
Map.prototype.keys()：返回键名的遍历器Map.prototype.values()：返回键值的遍历器Map.prototype.entries()：返回键值对的遍历器Map.prototype.forEach()：使用回调函数遍历每个成员
Map数据结构的使用
Map数据结构的操作方法
let a=new Map()
console.log(a.size); //0
a.set(1,"hello")
a.set(2,"world")
console.log(a); //Map { 1 => 'hello', 2 => 'world' }
console.log(a.has(1)) //true
console.log(a.delete(1)); //true
console.log(a.get(2)); //world 返回对应键值
console.log(a.clear()); //无返回值
Map数据结构的遍历方法
let a = new Map([
[1, 'hello'],
['b', 'world'],
[Symbol('c'), 'nihao'],
[true, 'shijie'],
[undefined, '!'],
[null, '!'],
[NaN, '!']
])
for (const iterator of a.keys()) {
console.log(iterator)
}
/*
1
b
Symbol(c)
true
undefined
null
NaN
*/
for (const iterator of a.values()) {
console.log(iterator)
}
/*
hello
world
nihao
shijie
!
!
!
*/
for (const iterator of a.entries()) {
console.log(iterator)
}
/*
[ 1, 'hello' ]
[ 'b', 'world' ]
[ Symbol(c), 'nihao' ]
[ true, 'shijie' ]
[ undefined, '!' ]
[ null, '!' ]
[ NaN, '!' ]
*/
a.forEach((value,key)=>{
console.log(key,value);
})
/*
1 hello
b world
Symbol(c) nihao
true shijie
undefined !
null !
NaN !
*/
Map数据结构与Object的区别
1.定义成员的方法不同
//Map
const map = new Map()
map.set('1', 1) // Map(1) {"key" => "value"}
//Object
const obj = {}
obj["1"] = 1
2. Map数据结构可以定义任意类型的键
3. Map 中的键值是有序的，而添加到对象中的键则不是。因此，当对它进行遍历时，Map 对象是按插入的顺序返回键值。（例子见以上遍历方法）
4. Object 都有自己的原型，原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。
let a = new Map()
a.set('constructor', 1)
console.log(a.__proto__) //Map {constructor: ƒ, get: ƒ, set: ƒ, has: ƒ, delete: ƒ, …}
let b = new Object()
console.log(b['constructor'] + '1') //function Object() { [native code] }1
总结
总之，如果遇到频繁删除与添加对象成员的场景，Map对象或许是更好的选择，其他时候仁者见仁智者见智。
