ES6 new Map() 的用法-Toy模板网

这篇具有很好参考价值的文章主要介绍了ES6 new Map() 的用法。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

一. 简介：

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

二. 案例

1. 定义Map

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

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

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

结果展示：

ES6 new Map() 的用法

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

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

const person = new Map()

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

结果展示：

ES6 new Map() 的用法

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')

结果展示：

ES6 new Map() 的用法

4. 清除Map中所有数据

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

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

person.clear()

结果展示：

ES6 new Map() 的用法

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)
})

结果展示：

ES6 new Map() 的用法

文章来源地址https://www.toymoban.com/news/detail-458548.html

三. 简单实战

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')

结果展示：

ES6 new Map() 的用法