Map

ES6 给我们提供了 Map 数据结构,它类似于对象,用于保存键值对。不同的是,Map 中键的范围不限于字符串类型,各种类型的值(包括对象)都可以当作一个键或一个值。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果需要用到“键值对”的数据结构,Map 比 Object 更合适。

Map和Object的区别

  • Object 中的键只能是字符串或者 Symbols 类型,但 Map 中的键可以是任意值。
  • Map 中的键值是有序的(FIFO 原则),而添加到对象中的键则不是。
  • Map 的键值对个数可以从 size 属性获取,而 Object 的键值对个数只能手动计算。
  • Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。

创建Map
Map 是 ES6 提供给我们的构造函数。
我们可以通过 Map() 方法来创建一个空 Map:

我们可以在创建时初始化 Map 时,Map 可以接收数组作为参数,并且数组成员也是一个个数组,其中包含两个元素,一个表示键,一个表示值。

image.png

不可以这么做,会报错
image.png

Map的方法和属性

set()方法
set() 方法用于设置所对应的键值对,然后返回整个 Map 结构,如果已经有值,则键值会被更新,否则就会生成新的键。

image.png

向map中添加三个键值对
image.png

get()方法
get() 方法用于读取 key 对应的键值,如果找不到 key,则返回 undefined。

下面代码中我们通过 set() 方法为 Map 设置键值对,然后通过 get() 方法获取指定键对应的值:

image.png

has()方法
has() 方法返回一个布尔值,表示某个键是否在 Map 数据结构中。在则返回 true,不在则返回 false。

image.png

delete()方法
delete() 方法用于删除某个键,删除成功返回 true,如果删除失败则返回 false。
image.png

clear()方法
clear() 方法用于清除 Map 中所有成员,没有返回值。

image.png

size属性
size 属性可以用于返回 Map 中成员总数。

image.png

Map 遍历方法
Map 原生提供三个遍历器生成函数和一个遍历方法。
keys()方法
keys() 方法是一个用于返回键名的遍历器。
image.png

values()方法
values() 方法与 keys() 对应,是一个用于返回键值的遍历器。
image.png

entries()方法
如果我们又想要遍历 Map 中的键又想要遍历 Map 中的值,可以使用 entries() 方法,entries() 方法用于返回所有成员的遍历器。

image.png

forEach()方法
forEach() 方法用于遍历 Map 的所有成员,第二个参数绑定 this。

image.png

Map的类型转换
Map 类型可以与其他的数据类型进行转换,我们一起来看一下。
Map 转为数组类型:可以使用扩展运算符… 来实现。
image.png

          let map1 = new Map();
          map1.set("name", "xkd");
          console.log([...map1]);  
          // 输出:[ [ 'name', 'xkd' ] ]
(完)