ES6 new Map() 的用法

一. 简介：

1. Map是一个类似于对象的数据类型
2. 与常规对象和Array不同的是，它是“键控集合“
3. 它的行为有稍许不同，并且在特定的上下文中使用，它可以提供相当大的性能优势

二. 案例

1. 定义Map

• 语法一：构造函数--声明时赋值

        参数：a. 必须是二维数组， b.二维数组 Map单元格是 键值对 的形式

const person = new Map([ ['name', '秋風落葉'], ['age', 27], ['sex', '男'] ])

  结果展示：

 

•  语法二：构造函数--声明后再赋值

         书写方式：Map对象.set(键名 , 数值)

const person = new Map()

person.set('name', '秋風落葉')

   结果展示：

 2. 获取Map数据

语法形式：Map数据类型.get(‘键名’)  ==>  person.get(‘name’)

const person = new Map([ ['name', '秋風落葉'], ['age', 27], ['sex', '男'] ])

// 获取
person.get('name') // 秋風落葉

 3. 删除Map中指定数据

语法形式：Map数据类型.delete(‘键名’) ==>  person.delete(‘name’);

const person = new Map([ ['name', '秋風落葉'], ['age', 27], ['sex', '男'] ])

person.delete('sex')

 结果展示：

4. 清除Map中所有数据

语法形式：Map数据类型.clear()  ==> person.clear();

const person = new Map([ ['name', '秋風落葉'], ['age', 27], ['sex', '男'] ])

person.clear()

结果展示：

 5. 判断是否是Map中的数据

语法形式：Map数据类型.has(‘键名’)

const person = new Map([ ['name', '秋風落葉'], ['age', 27], ['sex', '男'] ])

person.has('name') // true

person.has('aa') // false

6. 遍历Map

const person = new Map([ ['name', '秋風落葉'], ['age', 27], ['sex', '男'] ])

person.forEach((item, key) => {
    console.info(item, key)
})

结果展示：

 

三. 简单实战

const fruitColor = new Map()
    .set('red', ['apple', 'strawberry'])
    .set('yellow', ['banana', 'pineapple'])
    .set('purple', ['grape', 'plum']);
 
function printFruits(color) {
  return fruitColor.get(color) || [];
}

// 调用
printFruits('red')

结果展示：