ES6 new Map() 的用法

本文详细介绍了JavaScript中的Map对象,包括其定义、基本操作如获取、删除和遍历等,并通过实例展示了如何利用Map来管理和检索数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一. 简介:

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

结果展示:

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值