ES6 Map数据结构

1.Map是什么?

ES6 提供的另一种新的引用类型的数据结构 它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键)

以前引用类型中的对象也是键值对的集合 但是键限于字符串

总结起来就是:

  • Object 结构提供了“字符串—值”的对应,
  • Map 结构提供了“值—值”的对应,是一种更完善的 “键值对” 结构实现。
  • 如果你需要“键值对”的数据结构,Map 比 Object 更合适
  • 对象作为键,会隐式的调用toString()方法,从而导致后一个覆盖前一个键
  • 接受数组作为参数,该数组必须表示键值对的数组
  • Map传址,所以对象作为键名时传输的是地址,相同{},{}形式最为键,值不相等
  • Map接受数组作为参数的本质是通过forEach()循环,然后循环体内使用解构赋值items.forEach(([key, value],index) => map.set(key,value))
  • Map自带方法keys(),values(),entries(),forEach()等
  • Map参数的扩展:只要是具有 Iterator 接口且成员为键值对都可以作为Map的参数

2.怎么声明Map数据结构及Map的方法:set(), get(), has(), delete()

        const m = new Map();const o = { p: 'Hello World' };m.set(o, 'content')console.log( m.get(o) ); //"content"console.log( m.has(o) );// trueconsole.log( m.delete(o) );// trueconsole.log( m.has(o) );// false

3.证明是引用类型数据 instanceof 、Object.prototype.toString().call()

为什么instanceof可以判断对象或数组?

https://blog.csdn.net/qq_34569497/article/details/133889333

let res = map instanceof Map
let resMap = Object.prototype.toString.call(map)
console.log(res); // true
console.log(resMap); // [object Map]

4.Map和对象的区别:对象作为键,会隐式的调用toString()方法,从而导致后一个覆盖前一个键

对象作为键,会隐式的调用toString()方法,从而导致后一个覆盖前一个键

        let o1 = { a: 1 }let o2 = { b: 1 }let o3 = {}o3[o1] = 1o3[o2] = 2console.log(o3) // [object Object]: 2Object.keys(o3).map((v, i) => {console.log(v); // [object Object]console.log(i); // 0console.log(typeof v); // string})

Map就不存在覆盖: 

        let o1 = { a: 1 }let o2 = { b: 1 }let o3 = new Map()o3.set(o1, '123')o3.set(o2, '234')console.log(o3);console.log(o3.get(o1));console.log(o3.get(o2));

5.接受数组作为参数——该数组必须是表示键值对的数组

作为构造函数,Map 也可以接受一个数组作为参数。注意该数组的成员是一个个表示键值对的数组。

const map = new Map([['name', '张三'],['title', 'Author']
]);
map.get('name') // "张三"
map.get('title') // "Author"

6.Map传址特点--对象作为键名时,传输的是地址,所以下例中的两个{x:1}虽然长相一样,但实际值不同(存储在堆内存的两个位置)

对象作为键名时,传输的是地址,所以下例中的两个 {name:'曹操'} 虽然长相一样,但实际值不同(存储在堆内存的两个位置)

const map = new Map([['name', '张三'],['title', 'Author'],[{name:'曹操'},'枭雄']
]);
map.get('name') // "张三"
map.get('title') // "Author"
map.get({name:'曹操'});//返回undefined。为什么?因为应用数据类型比较的是地址 {name:'曹操'} !=={name:'曹操'}。

想要obj最为key并且可以获取值,必须以下面形式才行:

let obj = {name:'曹操'};
const map = new Map([obj,'枭雄']);
map.get(obj);//'枭雄'

7.Map构造函数接受数组作为参数的本质,内部机制使用forEach进行遍历

内部机制:

  • 通过items通过forEach()进行遍历 ,items.forEach(([key, value],index) => map.set(key,value))
  • 并且使用到数组解构的模式匹配
const items = [['name', '张三'],['title', 'Author']
];
const map = new Map();
items.forEach(([key, value],index) => map.set(key,value))

8.Map自带的一些方法 keys() values() entries()

9.Map参数的扩展

任何具有 Iterator 接口、且每个成员都是一个双元素的数组的数据结构 都可以当作Map构造函数的参数

const set = new Set([['foo', 1],['bar', 2]
]);
const m1 = new Map(set);
m1.get('foo') // 1
const m2 = new Map([['baz', 3]]);
const m3 = new Map(m2);
m3.get('baz') // 3

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

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

相关文章

03. C语言编写LED

03. C语言编写LED C语言环境搭配编写程序链接脚本 C语言环境搭配 设置处理器模式 设置6ULL处于SVC模式下。设置CPSR寄存器的bit4-0,也就是M[4:0]为100110x13。读写状态寄存器需要用到MRS和MSR指令。MRS将CPSR寄存器数据读出到通用寄存器里面,MSR指令将通…

react中如何对props传的参数进行必要的限制

目录 一:总结 二:实现步骤 2.1 安装需要的库 2.2 对props 进行参数限制 3.3 俩种属性限制 3.1 设置静态属性 3.2 设置默认属性值 一:总结 1:react中的 props 用于给组件传递属性,对所传递的属性可以作以下三种限…

毫米波雷达在环境监测中的关键作用

随着环境问题的日益凸显,精确、实时的环境监测成为了保护地球的关键一环。在这个背景下,毫米波雷达技术逐渐崭露头角,以其在环境监测中的独特优势成为不可或缺的工具。本文将探讨毫米波雷达在环境监测中的关键作用,以及它是如何应…

.NET 6.0 Web API Hangfire

Hangfire 文档 Hangfire 中文文档 Hangfire GitHub使用示例源码 在线Cron表达式生成器 ● Hangfire允许您以非常简单但可靠的方式在请求管道之外启动方法调用。 这种 后台线程 中执行方法的行为称为 后台任务。 ● 它是由:客户端、作业存储、服务端 组成的。 ● Hangfire可以在…

设计师首选:最佳的5款网页设计软件

对于UI设计师来说,网页设计是一项必要的技能。如何做好网页设计?除了设计理念,网页设计和制作软件的应用也是不可或缺的。目前市场上有很多这样的软件,工人要想做好,就必须先磨利工具。如果他们想做网页设计&#xff0…

缩短从需求到上线的距离:集成多种工程实践的稳定框架 | 开源日报 No.55

zeromicro/go-zero Stars: 25.7k License: MIT go-zero 是一个集成了各种工程实践的 web 和 rpc 框架。通过弹性设计保障了大并发服务端的稳定性,经受了充分的实战检验。 go-zero 包含极简的 API 定义和生成工具 goctl,可以根据定义的 api 文件一键生成…

linux系统编程之二

1&#xff09;mmap内存映射的案例(映射为int类型) #include<sys/types.h> #include<stdio.h> #include<fcntl.h> #include<stdlib.h> #include<error.h> #include<errno.h> #include<unistd.h> #include<sys/mman.h>int main…

云技术分享 | 快速构建 CodeWhisperer 代码生成服务,让 AI 辅助编程

前言 Amazon CodeWhisperer 是 2023 年 4 月份发布的一款通用的、机器学习驱动的代码生成器服务&#xff0c;CodeWhisperer 经过数十亿行 Amazon 和公开可用代码的训练&#xff0c;可以理解用自然语言&#xff08;英语&#xff09;编写的评论&#xff0c;可在集成式开发环境 (…

iOS代码混淆工具推荐:IPA Guard详细介绍

iOS代码混淆工具推荐&#xff1a;IPA Guard详细介绍 目录 摘要&#xff1a; 引言 正文 1. IPA Guard概述 2. IPA Guard的功能特性 3. IPA Guard的混淆模式 4. 支持的语言 5. 使用场景 总结 参考资料 总结 参考资料 摘要&#xff1a; 了解并选择合适的iOS代码混淆工…

uniapp订单循环列表倒计时

目录 效果图片插件uni-countdown代码最后 效果图片 插件uni-countdown 地址 代码 <template><view class""><!-- 下面循环两个列表 --><view class"item" v-for"(item, index) in listData" :key"index">&…

LeetCode 2 两数相加

题目描述 链接&#xff1a;https://leetcode.cn/problems/add-two-numbers/?envTypefeatured-list&envId2ckc81c?envTypefeatured-list&envId2ckc81c 难度&#xff1a;中等 给你两个 非空 的链表&#xff0c;表示两个非负的整数。它们每位数字都是按照 逆序 的方式…

【Hello Algorithm】暴力递归到动态规划(三)

暴力递归到动态规划&#xff08;三&#xff09; 最长公共子序列递归版本动态规划 最长回文串子序列方法一方法二递归版本动态规划 象棋问题递归版本动态规划 咖啡机问题递归版本动态规划 最长公共子序列 这是leetcode上的一道原题 题目连接如下 最长公共子序列 题目描述如下…

在 rider 里用配置 Perforce(P4)的注意事项

整个配置界面里&#xff0c;关键就配2处位置&#xff0c;但是都有些误导性。 1是连接形参的4个参数都得填&#xff0c;字符集看你项目的要求&#xff0c;这里工作区其实指的是你的工作空间&#xff0c;还不如显示英文的 Workspace 呢&#xff0c;搞得我一开始没填&#xff0c;…

【数字IC设计】DC自动添加门控时钟

简介 数字电路的动态功耗主要是由于寄存器翻转带来的&#xff0c;为了降低芯片内部功耗&#xff0c;门控时钟的方案应运而生。作为低功耗设计的一种方法&#xff0c;门控时钟是指在数据无效时将寄存器的时钟关闭&#xff0c;以此来降低动态功耗。 在下图中&#xff0c;展示了…

软信天成:流程管理是企业精细化管理的一大利器

流程管理&#xff08;BPM&#xff09;是指组织和管理内部或跨部门的工作流程&#xff0c;主要包括设计、建模、执行、监控和优化业务流程&#xff0c;确保工作按照标准化的步骤进行&#xff0c;从而提高效率、降低成本&#xff0c;促进业务增长。 一、流程管理生命周期五大步骤…

基于python的23种设计模式

以下是基于Python实现的23种设计模式及代码段和详细解释&#xff1a; 1. 工厂模式&#xff08;Factory Pattern&#xff09; 简介 工厂模式是一种创建型设计模式&#xff0c;它允许客户端代码通过工厂方法创建对象&#xff0c;而无需直接实例化对象。在工厂方法模式中&#…

Hadoop3教程(九):MapReduce框架原理概述

文章目录 简介参考文献 简介 这属于整个MR中最核心的一块&#xff0c;后续小节会展开描述。 整个MR处理流程&#xff0c;是分为Map阶段和Reduce阶段。 一般&#xff0c;我们称Map阶段的进程是MapTask&#xff0c;称Reduce阶段是ReduceTask。 其完整的工作流程如图&#xff…

2023亿发智能数字化解决方案供应商,贵州一体化企业信息管理系统

企业数字化服务的解决方案是指运用数字技术对企业运营进行全方位的数字化升级和优化&#xff0c;提供以数字化服务为核 心的全面解决方案&#xff0c;解决企业在数字化转型过程中面临的技术和业务难题。 数字化服务解决方案的功能 在数字化时代的背景下&#xff0c;贵州企业的…

ES6箭头函数

1.箭头函数的写法 如果函数内有返回值 var fn v > v 1 返回值如果不是表达式(是对象)&#xff0c;用()括号返回 var fn v > ({ obj: v }) 返回值如果不是表达式(也不是对象)方法体内按正常写 var fu () > {var a 1;var b a1;return b; } 2.箭头函数和普通…

【微信小程序】数字化会议OA系统之首页搭建(附源码)

&#x1f389;&#x1f389;欢迎来到我的CSDN主页&#xff01;&#x1f389;&#x1f389; &#x1f3c5;我是Java方文山&#xff0c;一个在CSDN分享笔记的博主。&#x1f4da;&#x1f4da; &#x1f31f;推荐给大家我的专栏《微信小程序开发实战》。&#x1f3af;&#x1f3a…