JS里 new Map()方法介绍

在JavaScript中,new Map() 用于创建一个新的Map对象。Map是一种数据结构,允许你存储键值对,其中任何值(对象和原始值)都可以作为一个键或一个值。

Map对象的特点:

  • 键值对存储:Map是一种键值对的集合,其中每个值都有一个相关联的键。
  • 键的唯一性:Map中的键是唯一的,不允许重复。新的值会覆盖与已存在键相关联的旧值。
  • 键的类型:Map的键可以是任何类型的值,包括基本数据类型、对象和函数。 顺序:Map能够记住键的原始插入顺序。
  • 迭代:Map是可迭代的,可以使用for...of循环或其他迭代方法遍历其键值对。
  • 方法:Map提供了一组方法来操作集合,包括set()用于添加键值对,get()用于获取值,has()用于检查键是否存在,delete()用于删除键值对,size属性用于获取集合的大小,以及clear()用于清空集合。
    new Map() 在 JavaScript 中用于创建一个新的 Map 对象,该对象用于存储键值对的数据结构。以下是关于 new Map() 的详细使用教学:

1. 创建 Map 对象

javascript 复制代码
创建空 Map
let myMap = new Map();
创建带有初始值的 Map
let myMap = new Map([  
  ['key1', 'value1'],  
  ['key2', 'value2'],  
  // ... 可以添加更多的键值对  
]);
//或者
let myMap = new Map();  
myMap.set('key1', 'value1');  
myMap.set('key2', 'value2');  
// ... 可以继续添加键值对

2. Map 对象的方法

javascript 复制代码
set(key, value)
向 Map 对象中添加一个键值对。
如果键已经存在,则更新其对应的值。
javascript 复制代码
myMap.set('key3', 'value3');
get(key)
获取指定键对应的值。
如果键不存在,则返回 undefined。
javascript 复制代码
let value = myMap.get('key1'); // value 为 'value1'
has(key)
判断 Map 对象中是否存在指定的键。
存在返回 true,否则返回 false。
javascript 复制代码
let hasKey = myMap.has('key2'); // hasKey 为 true
delete(key)
删除指定键及其对应的值。
成功删除返回 true,否则返回 false
javascript 复制代码
let isDeleted = myMap.delete('key1'); // isDeleted 为 true
size
返回 Map 对象中键值对的数量
javascript 复制代码
let size = myMap.size; // size 为剩余键值对的数量
clear()
清空 Map 对象中的所有键值对
javascript 复制代码
myMap.clear(); // myMap 变为空 Map
keys()
返回一个包含 Map 对象中所有键的迭代器。
values()
返回一个包含 Map 对象中所有值的迭代器。
entries()
返回一个包含 Map 对象中所有键值对的迭代器。

3. 迭代 Map 对象

你可以使用 for...of 循环来迭代 Map 对象的键、值或键值对。

javascript 复制代码
// 迭代键  
for (let key of myMap.keys()) {  
  console.log(key);  
}  
javascript 复制代码
// 迭代值  
for (let value of myMap.values()) {  
  console.log(value);  
} 
javascript 复制代码
// 迭代键值对  
for (let [key, value] of myMap.entries()) {  
  console.log(key, value);  
}

4. 注意事项

Map 的键可以是任何类型的值(包括函数、对象或任何原始值)。

Map 会记住键的原始插入顺序。

虽然 for...of 循环在迭代时似乎显示了顺序,但应注意 Map 本身并不保证元素的顺序在所有情况下都是一致的(尽管在大多数现代浏览器和环境中,它们会按照插入顺序进行迭代)。

相关推荐
kyle~1 分钟前
算法数学---差分数组(Difference Array)
java·开发语言·算法
曹牧1 分钟前
C#:三元运算符
开发语言·c#
Jonathan Star20 分钟前
MediaPipe 在Python中实现人体运动识别,最常用且高效的方案是结合**姿态估计**(提取人体关键点)和**动作分类**(识别具体运动)
开发语言·python·分类
明远湖之鱼23 分钟前
浅入理解跨端渲染:从零实现 React DSL 跨端渲染机制
前端·react native·react.js
滨HI032 分钟前
C++ opencv拟合直线
开发语言·c++·opencv
沐浴露z42 分钟前
详解JDK21新特性【虚拟线程】
java·开发语言·jvm
艾莉丝努力练剑1 小时前
【C++:红黑树】深入理解红黑树的平衡之道:从原理、变色、旋转到完整实现代码
大数据·开发语言·c++·人工智能·红黑树
悟忧1 小时前
规避ProseMirror React渲染差异带来的BUG
前端
小皮虾1 小时前
小程序云开发有类似 uniCloud 云对象的方案吗?有的兄弟,有的!
前端·javascript·小程序·云开发
l1t1 小时前
利用DeepSeek优化SQLite求解数独SQL用于DuckDB
开发语言·数据库·sql·sqlite·duckdb