深入理解 JavaScript 中的 Map 对象

news2024/9/9 5:39:22

在 JavaScript 中,Map 对象是一种用于存储键值对的数据结构。与传统的对象不同,Map 对象允许使用任意类型的值作为键。这使得 Map 在某些情况下比对象更为灵活和强大。本文将深入探讨 Map 对象的特性、使用方法以及其与对象的比较。

创建 Map 对象

你可以使用 new Map() 构造函数来创建一个新的 Map 对象:

 

const map = new Map();

你也可以传递一个可迭代对象(例如数组)来初始化 Map 对象:

 

const map = new Map([ ['key1', 'value1'], ['key2', 'value2'], ['key3', 'value3'] ]);

Map 的基本操作

设置值

使用 set 方法可以在 Map 中添加或更新一个键值对:

 

map.set('key1', 'value1'); map.set('key2', 'value2'); map.set(1, 'numberKey'); map.set(true, 'booleanKey');

获取值

使用 get 方法可以通过键获取对应的值:

 

console.log(map.get('key1')); // 输出:'value1' console.log(map.get(1)); // 输出:'numberKey' console.log(map.get(true)); // 输出:'booleanKey'

检查键是否存在

使用 has 方法可以检查一个键是否存在于 Map 中:

 

console.log(map.has('key1')); // 输出:true console.log(map.has('key3')); // 输出:false

删除键值对

使用 delete 方法可以从 Map 中删除一个键值对:

 

map.delete('key1'); console.log(map.has('key1')); // 输出:false

清空 Map

使用 clear 方法可以清空 Map 中的所有键值对:

 

map.clear(); console.log(map.size); // 输出:0

迭代 Map

Map 对象提供了几种迭代方法来遍历其内容:

forEach

forEach 方法可以对 Map 中的每个键值对执行一次提供的函数:

 

map.set('key1', 'value1'); map.set('key2', 'value2'); map.forEach((value, key) => { console.log(`${key}: ${value}`); }); // 输出: // key1: value1 // key2: value2

keysvaluesentries

Map 提供了 keysvalues 和 entries 方法来分别获取键、值和键值对的迭代器:

 

for (let key of map.keys()) { console.log(key); } for (let value of map.values()) { console.log(value); } for (let [key, value] of map.entries()) { console.log(`${key}: ${value}`); }

Map 与对象的比较

虽然对象和 Map 都可以用来存储键值对,但它们有一些重要的区别:

  1. 键的类型:对象的键只能是字符串或 Symbol,而 Map 的键可以是任意类型的值,包括对象、函数等。
  2. 键值对的顺序Map 对象按插入顺序迭代其元素,而对象的键值对顺序通常是不确定的。
  3. 性能:在某些操作(如频繁的增删改查)中,Map 的性能可能优于对象。
  4. 默认键:对象继承自 Object.prototype,因此具有一些默认的键(如 constructor)。而 Map 没有这些默认的键。

结论

Map 对象提供了一种灵活且强大的键值对存储方式,尤其适用于需要使用非字符串类型作为键的场景。通过理解 Map 的基本操作和与对象的区别,你可以更有效地选择适合你应用的数据结构。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1961747.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

跟着动脑学院学习Android 开发基础

跟着动脑学院up主学习Android开发,记录学习笔记 2022 最新 Android 基础教程,从开发入门到项目实战,看它就够了,更新中_哔哩哔哩_bilibili (弱弱地说一句,绝大部分内容都是up主为我们准备好的资料里摘抄下…

机器学习 | 评估原理——模型评估与交叉验证

Hi,大家好,我是半亩花海。学完分类算法原理的知识,我们进入评估相关知识的学习,继续更新《白话机器学习的数学》这本书的学习笔记,在此分享模型评估与交叉验证相关评估原理。本章的基于前几节已建立的模型进行评估知识…

【C语言】Linux 飞翔的小鸟

【C语言】Linux 飞翔的小鸟 零、环境部署 安装Ncurses库 sudo apt-get install libncurses5-dev壹、编写代码 代码如下&#xff1a; bird.c #include<stdio.h> #include<time.h> #include<stdlib.h> #include<signal.h> #include<curses.h>…

LeetCode:相同的树(C语言)

1、问题概述&#xff1a;给2个二叉树的根节点p和q&#xff0c;如果2个树在结构和数值上都相同才为true&#xff0c;否则为false 2、示例 示例 1&#xff1a; 输入&#xff1a;p [1,2,3], q [1,2,3] 输出&#xff1a;true 示例 2&#xff1a; 输入&#xff1a;p [1,2], q […

做知识付费项目还能做吗?知识付费副业项目如何做?能挣多少钱?

hello,我是阿磊&#xff0c;一个20年的码农&#xff0c;6年前代码写不动了&#xff0c;转型专职做副业项目研究&#xff0c;为劳苦大众深度挖掘互联网副业项目&#xff0c;共同富裕。 现在做知识付费项目还能做吗&#xff1f; 互联网虚拟资源项目我一直在做&#xff0c;做了有…

AI绘画模型之:UNet、Imagen 与 DeepFloyd IF

重磅推荐专栏: 《大模型AIGC》 《课程大纲》 《知识星球》 本专栏致力于探索和讨论当今最前沿的技术趋势和应用领域,包括但不限于ChatGPT和Stable Diffusion等。我们将深入研究大型模型的开发和应用,以及与之相关的人工智能生成内容(AIGC)技术。通过深入的技术解析和实践经…

spring boot(学习笔记第十五课)

spring boot(学习笔记第十五课) Spring boot的websocket(广播) 学习内容&#xff1a; Spring boot的websocket&#xff08;广播&#xff09; 1. Spring boot的websocket&#xff08;广播&#xff09; 回顾下web server的进化 第一代Web程序&#xff0c;使用整体页面刷新技术…

GPT-4o mini- 开发者的新宠儿

在人工智能的浪潮中,一颗新星正在冉冉升起。OpenAI最新发布的GPT-4o mini模型以其惊人的性能和极具竞争力的价格,正在成为开发者们的新宠儿。作为一名大数据开发者,我深深被这个"迄今为止最具成本效益的小模型"所吸引。让我们一起探索GPT-4o mini的魅力,看看它如何改…

一些问题 7/28

get post可以public吗 在Java Servlet中&#xff0c;doGet()和doPost()方法的访问修饰符通常是public&#xff0c;因为这些方法需要被Servlet容器&#xff08;如Tomcat&#xff09;调用。 如果将这些方法声明为private或protected&#xff0c;Servlet容器将无法访问它们&…

RocketMQ Server Windows安装

RocketMQ阿里开发 开源给apache 官网:RocketMQ 官方网站 | RocketMQ 下载后解压 配置环境变量 注意启动顺序 双击 注意 4.9.0这个版本必须 jdk 8 高了用不了 namesrv是注册中心的作用 broke是核心用于接收生产者消息 存储消息 发送给消费者消息 类似DubboZookeeper…

C++ 绘制画布标尺

目标 关键代码 CRulerDrawer::CRulerDrawer(QPainter& painter, QRect rect, int scalePercent): m_painter(painter), m_rect(rect), m_scalePercent(scalePercent) {m_palette qApp->palette();m_scaleUnitSize PixelRuler::Instance()->GetScaleUnitSize(); }vo…

【JS|第22期】深入理解跨域

日期&#xff1a;2024年7月6日 作者&#xff1a;Commas 签名&#xff1a;(ง •_•)ง 积跬步以致千里,积小流以成江海…… 注释&#xff1a;如果您觉得有所帮助&#xff0c;帮忙点个赞&#xff0c;也可以关注我&#xff0c;我们一起成长&#xff1b;如果有不对的地方&#xff…

Vue开发环境搭建

文章目录 引言I 安装NVM1.1 Windows系统安装NVM,实现Node.js多版本管理1.2 配置下载镜像1.3 NVM常用操作命令II VUE项目的基础配置2.1 制定不同的环境配置2.2 正式环境隐藏日志2.3 vscode常用插件引言 开发工具: node.js 、npm 开发编辑器:vscode 开发框架:VUE I 安装NVM…

react中zuStand状态管理工具使用

一、zuStand的基本使用 1.安装工具 npm install zustand 2.新建文件 在src下新建store文件夹&#xff0c;在store文件夹下新建zuStand.js文件 3.配置zuStand.js // 1.引入创建方法 import { create } from "zustand";// 2.创建store const useStore create((s…

未来不会使用 AI 的人真的会被淘汰吗?

AI 是今年大火的一个话题&#xff0c;随着 ChatGPT 之类的一系列大模型开始流行以后&#xff0c;有不少的培训机构宣称这样的口号: “未来不会使用 AI 的人将会被淘汰”。我觉得这个观点本身并没有错&#xff0c;但是关键在于那些培训机构出于自身的利益&#xff0c;故意忽略了…

(源码分析)springsecurity认证授权

了解 1. 结构总览 SpringSecurity所解决的问题就是安全访问控制&#xff0c;而安全访问控制功能其实就是对所有进入系统的请求进行拦截&#xff0c;校验每个请求是否能够访问它所期望的资源。 根据前边知识的学习&#xff0c;可以通过Filter或AoP等技术来实现&#xff0c;Spr…

Sparse Vector Coding稀疏矢量码介绍

需要MATLAB代码的小伙伴请通过微信公众号私信我~ 更多精彩内容请关注微信公众号 ‘优化与算法’ 前言 5G和6G无线通信期望带来更高的频谱效率和能量效率&#xff0c;为了达到这些目标&#xff0c;近年来已经提出了各种新技术。其中&#xff0c;索引调制IM&#xff08;Index …

「树形结构」基于 Antd 实现一个动态增加子节点+可拖拽的树

效果 如图所示 实现 import { createRoot } from react-dom/client; import React, { useState } from react; import { Tree, Input, Button } from antd; import { PlusOutlined } from ant-design/icons;const { TreeNode } Tree; const { Search } Input;const ini…

优选算法之位运算

目录 一、常见位运算总结 1.基础位运算 2.给定一个数 n&#xff0c;确定它的二进制表示中的第 x 位是 0 还是 1 3.将一个数 n 的二进制表示的第 x 位修改成1 4.将一个数 n 的二进制表示的第 x 位修改成 0 5.提取一个数 n 二进制表示中最右侧的1 6.干掉一个数 n 二进制表示…

分布式存储系统架构及应用

分布式存储系统概述&#xff08;详细、全面&#xff09; 【摘要】深度剖析分布式存储系统的可靠性、可用性、IO性能、数据存储效率、安全性及管理性&#xff0c;为寻求了解此领域的读者提供实用参考。 一、 内容总括 分布式存储系统&#xff0c;依托网络互联的多节点软硬件协同…