ES6 新特性之 Map 数据结构

基本用法

ES6 提供了 Map 数据结构,它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键

const m = new Map()
const o = {p: 'Hello World'}

m.set(o, 'content')
m.get(o) // "content"

m.has(o) // true
m.delete(o) // true
m.has(o) // false

Map 作为构造函数也可以接受一个数组作为参数,该数组的成员是表示键值对的数组

const map = new Map([
  ['name', '张三'],
  ['title', 'Author']
])

map.size // 2
map.has('name') // true
map.get('name') // "张三"
map.has('title') // true
map.get('title') // "Author"

事实上,任何具有 Iterator 接口、且每个成员都是一个双元素的数组的数据结构都可以当作 Map 构造函数的参数

const set = new Set([
  ['foo', 1],
  ['bar', 2]
])
const m1 = new Map(set)
m1.get('foo') // 1

const m2 = new Map([['baz', 3]])
const m3 = new Map(m2)
m3.get('baz') // 3

如果对同一个键多次赋值,后面的值将覆盖前面的值

const map = new Map()
map.set(1, 'aaa').set(1, 'bbb')
map.get(1) // "bbb"

如果读取一个未知的键,则返 undefined

new Map().get('asfddfsasadf')
// undefined

只有对同一个对象的引用,Map 结构才将其视为同一个键

const map = new Map()
map.set(['a'], 555)
map.get(['a']) // undefined

如果 Map 的键是一个简单类型的值(数字、字符串、布尔值),则只要两个值严格相等,Map 将其视为一个键

let map = new Map()

map.set(-0, 123)
map.get(+0) // 123

map.set(true, 1)
map.set('true', 2)
map.get(true) // 1

map.set(undefined, 3)
map.set(null, 4)
map.get(undefined) // 3

map.set(NaN, 123)
map.get(NaN) // 123

属性和操作方法

属性 描述
size 返回 Map 结构的成员总数
方法 描述
set(key, value) 设置键名 key 对应的键值为 value,然后返回整个 Map 结构
get(key) 读取 key 对应的键值,如果找不到 key,返回 undefined
has(key) 返回一个布尔值,表示某个键是否在当前 Map 对象之中
delete(key) 删除某个键,返回 true,如果删除失败,返回 false
clear() 清除所有成员,没有返回值
遍历方法 描述
keys() 返回键名的遍历器
values() 返回键值的遍历器
entries() 返回所有成员的遍历器
forEach() 遍历 Map 的所有成员
const map = new Map([
  ['F', 'no'],
  ['T',  'yes'],
])

for (let key of map.keys()) {
  console.log(key)
}
// "F"
// "T"

for (let value of map.values()) {
  console.log(value)
}
// "no"
// "yes"

for (let item of map.entries()) {
  console.log(item[0], item[1])
}
// "F" "no"
// "T" "yes"

for (let item of map) {
  console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"

上面代码最后的那个例子,表示 Map 结构的默认遍历器接口(Symbol.iterator属性),就是 entries 方法

map[Symbol.iterator] === map.entries
// true

Map 与拓展运算符结合

使用拓展运算符可以很方便的将 Map 数据结构转为数组

const myMap = new Map()
  .set(true, 7)
  .set({foo: 3}, ['abc'])
[...myMap]
// [ [ true, 7 ], [ { foo: 3 }, [ 'abc' ] ] ]

本文转载自 http://es6.ruanyifeng.com/#docs/set-map#Map 并进行整理

除特殊说明外本人博客均属原创,转载请注明出处:http://blog.johnhan.cn/blog_1041.html
鄂ICP备17018604号-1  鄂公网安备42060702000030号