当前位置: 首页 > news >正文

ES6 新增 Set、Map 两种数据结构的理解

ES6 新增 Set、Map 两种数据结构的理解

  • Set 是一种叫做集合的数据结构,
    • 集合是由一堆无序的相关联的 , 且不重复的内存结构【 数学中称为元素 】组成的组合;
  • Map 是一种叫做字典的数据结构
    • 字典是一些元素的集合 。每个元素有一个称作 key 的域 , 不同元素的key 各不相同。

Set 和 Map 的区别 ?

  • 共同点 : 集合、字典都可以存储不重复的值
  • 不同点 : 集合是以 [ 值 , 值 ] 的形式存储元素 , 字典是以 [ 键 , 值 ] 的形式存储。

Set

Set 是 es6 新增的数据结构 , 类似于数组 , 但是成员的值都是唯一的 , 没有重复的值 , 我们一般称为集合。

Set 本身是一个构造函数 , 用来生成 Set 数据结构。

const s = new Set();

增删改查

Set 的实例关于增删改查的方法有如下 :

  • add()
  • delete()
  • has()
  • clear()
add()

添加某个值 , 返回 Set 结构本身;当添加实例中已经存在的元素 , set 不会进行处理添加

s.add(1).add(2).add(2); // 2只被添加了1次
delete()

删除某个值 , 返回一个布尔值 , 表示删除是否成功

s.delete(1)
has()

返回一个布尔值 , 判断该值是否为 Set 的成员

s.has(2)
clear()

清除所有成员 , 没有返回值

s.clear()

遍历

Set 的实例关于遍历的方法有如下 :

  • keys() 返回键名的遍历器
  • values() 返回键值的遍历器
  • entries() 返回键值对的遍历器
  • forEach() 使用回调函数遍历每个成员

Set 的遍历顺序就是插入顺序

keys 方法 、 values 方法 、 entries 方法返回的都是遍历器对 象

let set = new Set(['red', 'green', 'blue']);for (let item of set.keys()) {console.log(item);
}
// red
// green
// bluefor (let item of set.values()) {console.log(item);
}
// red
// green
// bluefor (let item of set.entries()) {console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]

forEach() 用于对每个成员执行某种操作 , 没有返回值 , 键值、键名都相等 , 同样的 forEach 方法有第二个参数 , 用 于绑定处理函数的 this

let set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9

扩展运算符和 Set 结构相结合实现数组或字符串去重

// 数组
let arr = [3, 5, 2, 2, 5, 5];
let unique = [...new Set(arr)]; // [3, 5, 2]// 字符串
let str = "352255";
let unique = [...new Set(str)].join(""); // "352"

实现并集、交集、和差集

let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);// 并集
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4}// 交集
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3}// (a相当于b的)差集 
let difference = new Set([...a].filter(x => !b.has(x)));
// Set {1}

Map

Map 类型是 键值对的有序列表 , 而 键和值都可以是任意类型

Map 本身是一个构造函数 , 用来生成 Map 数据结构

const m = new Map()

增删改查

Map 结构的实例针关于增删改查有以下属性和操作方法 :

  • size 属性
  • set()
  • get()
  • has()
  • delete()
  • clear()
size

size 属性返回 Map 结构的成员总数 。

const map = new Map();
map.set('foo', true);
map.set('bar', false);map.size // 2
set()

设置键名 key 对应的键值为 value , 然后返回整个 Map 结构

如果 key 已经有值 , 则键值会被更新 , 否则就新生成该键;同时返回的是当前 Map 对象 , 可采用链式写法

const m = new Map();m.set('edition', 6) // 键是字符串
m.set(262, 'standard') // 键是数值
m.set(undefined, 'nah') // 键是 undefined
m.set(1, 'a').set(2, 'b').set(3, 'c') // 链式操作
get()

get 方法读取 key 对应的键值 , 如果找不到 key , 返回 undefined

const m = new Map();const hello = function() {console.log('hello');};
m.set(hello, 'Hello ES6!') // 键是函数m.get(hello) // Hello ES6!
has()

has 方法返回一个布尔值 , 表示某个键是否在当前 Map 对象之中

const m = new Map();m.set('edition', 6);
m.set(262, 'standard');
m.set(undefined, 'nah');m.has('edition') // true
m.has('years') // false
m.has(262) // true
m.has(undefined) // true
delete()

delete 方法删除某个键 , 返回 true 。 如果删除失败 , 返回 false

const m = new Map();
m.set(undefined, 'nah');
m.has(undefined) // truem.delete(undefined)
m.has(undefined) // false
clear()

clear 方法清除所有成员 , 没有返回值

let map = new Map();
map.set('foo', true);
map.set('bar', false);map.size // 2
map.clear()
map.size // 0

遍历

Map 结构原生提供三个遍历器生成函数和一个遍历方法 :

  • keys() 返回键名的遍历器
  • values() 返回键值的遍历器
  • entries() 返回所有成员的遍历器
  • forEach() 遍历 Map 的所有成员

遍历顺序就是插入顺序

const map = new Map([['F', 'no'],['T', 'yes'],
]);for (let key of map.keys()) {console.log(key);
}
// "F"
// "T"for (let value of map.values()) {console.log(value);
}
// "no"
// "yes"for (let item of map.entries()) {console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"// 或者
for (let [key, value] of map.entries()) {console.log(key, value);
}
// "F" "no"
// "T" "yes"// 等同于使用map.entries()
for (let [key, value] of map) {console.log(key, value);
}
// "F" "no"
// "T" "yes"map.forEach(function(value, key, map) {console.log("Key: %s, Value: %s", key, value);
});

WeakSet

创建 WeakSet 实例

const ws = new WeakSet();

WeakSet 可以接受一个具有 Iterable 接口的对象作为参数

const a = [[1, 2], [3, 4]];
const ws = new WeakSet(a);		// WeakSet {[1, 2], [3, 4]}

在 API 中 WeakSet 与 Set 有两个区别 :

  • 没有遍历操作的 API
  • 没有 size 属性

WeakSet 成员只能是引用类型 , 而不能是其他类型的值

let ws=new WeakSet();// 成员不是引用类型
let weakSet=new WeakSet([2,3]);
console.log(weakSet) // 报错// 成员为引用类型
let obj1={name:1}
let obj2={name:1}
let ws=new WeakSet([obj1,obj2]);
console.log(ws) //WeakSet {{…}, {…}}

WeakSet 里面的引用只要在外部消失 , 它在 WeakSet 里面的引用就会自动消失

WeakMap

WeakMap 结构与 Map 结构类似 , 也是用于生成键值对的集合

在 API 中 WeakMap 与 Map 有两个区别 :

  • 没有遍历操作的 API
  • 没有 clear 清空方法
// WeakMap 可以使用 set 方法添加成员 
const wm1 = new WeakMap();
const key = {foo: 1};
wm1.set(key, 2);
wm1.get(key) // 2// WeakMap 也可以接受一个数组,作为构造函数的参数
const k1 = [1, 2, 3];
const k2 = [4, 5, 6];
const wm2 = new WeakMap([[k1, 'foo'], [k2, 'bar']]);
wm2.get(k2) // "bar"

WeakMap 只接受对象作为键名 ( null 除 外 ) , 不接受其他类型的值作为键名

const map = new WeakMap();
map.set(1, 2)
// TypeError: 1 is not an object!
map.set(Symbol(), 2)
// TypeError: Invalid value used as weak map key
map.set(null, 2)
// TypeError: Invalid value used as weak map key

WeakMap 的键名所指向的对象 , 一旦不再需要 , 里面的键名对象和所对应的键值对会自动消失 , 不用手动删除引用

举个场景例子 :

在网页的 DOM 元素上添加数据 , 就可以使用 WeakMap 结构 , 当该 DOM 元素被清除 , 其所对应的 WeakMap 记录就会自动被移除

const wm = new WeakMap();const element = document.getElementById('example');wm.set(element, 'some information');
wm.get(element) // "some information"

注意:WeakMap 弱引用的只是键名,而不是键值。键值依然是正常引用。

下面代码中 , 键值 obj 会在 WeakMap 产生新的引用 , 当修改 obj 时 不会影响到内部

const wm = new WeakMap();
let key = {};
let obj = {foo: 1};wm.set(key, obj);
obj = null;
wm.get(key)
// Object {foo: 1}

相关文章:

ES6 新增 Set、Map 两种数据结构的理解

ES6 新增 Set、Map 两种数据结构的理解 Set 是一种叫做集合的数据结构, 集合是由一堆无序的、相关联的 , 且不重复的内存结构【 数学中称为元素 】组成的组合; Map 是一种叫做字典的数据结构 字典是一些元素的集合 。每个元素有一个称作 key 的域 , 不同…...

影视视频知识付费行业万能通用网站系统源码,三网合一,附带完整的安装部署教程

在数字化时代,知识付费行业逐渐成为主流。人们对高质量内容的需求日益增长,越来越多的人愿意为有价值的知识和信息服务付费。为了满足这一市场需求,罗峰给大家分享一款全新的影视视频知识付费网站系统源码,为用户提供一站式的知识…...

Java字符串拼接常用方法总结

使用场景:用某个分隔符拼接字符串 下边是我使用过的几种方式废话不多说,直接上代码初始数据 1.使用流2.StringBuilder3.[StringJoiner](https://blog.csdn.net/qq_43417581/article/details/126076152?ops_request_misc%257B%2522request%255Fid%2522%2…...

【2023 CSIG垂直领域大模型】大模型时代,如何完成IDP智能文档处理领域的OCR大一统?

目录 一、像素级OCR统一模型:UPOCR1.1、为什么提出UPOCR?1.2、UPOCR是什么?1.2.1、Unified Paradigm 统一范式1.2.2、Unified Architecture统一架构1.2.3、Unified Training Strategy 统一训练策略 1.3、UPOCR效果如何? 二、OCR大一统模型前…...

Phi-2小语言模型QLoRA微调教程

前言 就在不久前,微软正式发布了一个 27 亿参数的语言模型——Phi-2。这是一种文本到文本的人工智能程序,具有出色的推理和语言理解能力。同时,微软研究院也在官方 X 平台上声称:“Phi-2 的性能优于其他现有的小型语言模型&#…...

hadoop自动获取时间

1、自动获取前15分钟 substr(from_unixtime(unix_timestamp(concat(substr(20240107100000,1,4),-,substr(20240107100000,5,2),-,substr(20240107100000,7,2), ,substr(20240107100000,9,2),:,substr(20240107100000,11,2),:,00))-15*60,yyyyMMddHHmmss),1) unix_timestam…...

【面试高频算法解析】算法练习8 单调队列

前言 本专栏旨在通过分类学习算法,使您能够牢固掌握不同算法的理论要点。通过策略性地练习精选的经典题目,帮助您深度理解每种算法,避免出现刷了很多算法题,还是一知半解的状态 专栏导航 二分查找回溯(Backtracking&…...

ATTCK视角下的信息收集:Sysmon检测

目录 1、简介 2、使用Sysmon 3、检测Sysmon是否安装运行 4、检测Sysmon是否被卸载 5、使Sysmon在终端隐匿运行的技术 1、简介 Sysmon(系统监视器)是由windows sysinternals 出品的Sysinternals 系列工具中的一个 它是windows系统服务和设备驱动程…...

02、Kafka ------ 配置 Kafka 集群

目录 配置 Kafka 集群配置步骤启动各Kafka节点 配置 Kafka 集群 启动命令: 1、启动 zookeeper 服务器端 小黑窗输入命令: zkServer 2、启动 zookeeper 的命令行客户端工具 (这个只是用来看连接的节点信息,不启动也没关系&#…...

2024年全球网络安全预测报告

1.Gartner Gartners Top Strategic Predictions for 2024 and Beyond《Gartner顶级战略预测:2024年及未来》 https://www.gartner.com/en/articles/gartner-s-top-strategic-predictions-for-2024-and-beyond 2.IDC Top 10 Worldwide IT Industry 2024 Predict…...

Qt - QML与C++数据交互详解

文章目录 1 . 前言2 . Qml调用C的变量3 . Qml调用C的类4 . Qml调用C的方法5 . Qml接收C的信号6 . C接收Qml的信号(在Qml中定义信号槽)7 . C接收Qml的信号(在C中定义信号槽)8 . C调用Qml的函数9 . 总结 【极客技术传送门】 : https…...

Kettle Local引擎使用记录(一)(基于Kettle web版数据集成开源工具data-integration源码)

Kettle Web 📚第一章 前言📚第二章 demo源码📗pom.xml引入Kettle引擎核心文件📗java源码📕 controller📕 service📕 其它📕 maven settings.xml 📗测试📕 测试…...

Java--业务场景:在Spring项目启动时加载Java枚举类到Redis中(补充)

文章目录 前言步骤测试结果 前言 通过Java–业务场景:在Spring项目启动时加载Java枚举类到Redis中,我们成功将Java项目里的枚举类加载到Redis中了,接下来我们只需要写接口获取需要的枚举值数据就可以了,下面一起来编写这个接口吧。 步骤 在…...

WPF 基础入门(资源字典)

资源字典 每个Resources属性存储着一个资源字典集合。如果希望在多个项目之间共享资源的话,就可以创建一个资源字典。资源字段是一个简单的XAML文档,该文档就是用于存储资源的,可以通过右键项目->添加资源字典的方式来添加一个资源字典文件…...

文章解读与仿真程序复现思路——电网技术EI\CSCD\北大核心《考虑电氢耦合和碳交易的电氢能源系统置信间隙鲁棒规划》

本专栏栏目提供文章与程序复现思路,具体已有的论文与论文源程序可翻阅本博主免费的专栏栏目《论文与完整程序》 这标题涉及到一个复杂的能源系统规划问题,其中考虑了电氢耦合、碳交易和置信间隙鲁棒规划。以下是对标题各个部分的解读: 电氢耦…...

ubuntu设定时间与外部ntp同步

前言 在 Ubuntu 上,你可以通过配置 systemd-timesyncd 服务来与外部 NTP 服务器同步系统时间。下面是设置的步骤: 安装 NTP 工具: 如果你的系统中没有安装 ntpdate 工具,可以使用以下命令安装: sudo apt-get updat…...

DataFrame详解

清洗相关的API 清洗相关的API: 1.去重API: dropDupilcates 2.删除缺失值API: dropna 3.替换缺失值API: fillna 去重API: dropDupilcates dropDuplicates(subset):删除重复数据 1.用来删除重复数据,如果没有指定参数subset,比对行中所有字段内容,如果全部相同,则认为是重复数据,…...

控制障碍函数(Control Barrier Function,CBF) 三、代码

三、代码实现 3.1、模型 这是一个QP问题,所以我们直接建模 这其实还是之前的那张图,我们把这个大的框架带入到之前的那个小车追击的问题中去,得到以下的一些具体的约束条件 CLF约束 L g V ( x ) u − δ ≤ − L f V ( x ) − λ V ( x ) …...

哈希表-散列表数据结构

1、什么是哈希表? 哈希表也叫散列表,哈希表是根据关键码值(key value)来直接访问的一种数据结构,也就是将关键码值(key value)通过一种映射关系映射到表中的一个位置来加快查找的速度,这种映射关系称之为哈希函数或者散列函数&…...

C# 强制类型转换和as区别和不同使用场景

文章目录 1.强制类型转换2. as 运算符3.实例总结: 在C#中,as 和 强制类型转换(例如 (T)value)的主要区别在于它们处理类型转换不成功时的行为和适用场景: 1.强制类型转换 使用语法:Type variable (Type)…...

JavaSec-RCE

简介 RCE(Remote Code Execution),可以分为:命令注入(Command Injection)、代码注入(Code Injection) 代码注入 1.漏洞场景:Groovy代码注入 Groovy是一种基于JVM的动态语言,语法简洁,支持闭包、动态类型和Java互操作性&#xff0c…...

ssc377d修改flash分区大小

1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...

STM32F4基本定时器使用和原理详解

STM32F4基本定时器使用和原理详解 前言如何确定定时器挂载在哪条时钟线上配置及使用方法参数配置PrescalerCounter ModeCounter Periodauto-reload preloadTrigger Event Selection 中断配置生成的代码及使用方法初始化代码基本定时器触发DCA或者ADC的代码讲解中断代码定时启动…...

五年级数学知识边界总结思考-下册

目录 一、背景二、过程1.观察物体小学五年级下册“观察物体”知识点详解:由来、作用与意义**一、知识点核心内容****二、知识点的由来:从生活实践到数学抽象****三、知识的作用:解决实际问题的工具****四、学习的意义:培养核心素养…...

NFT模式:数字资产确权与链游经济系统构建

NFT模式:数字资产确权与链游经济系统构建 ——从技术架构到可持续生态的范式革命 一、确权技术革新:构建可信数字资产基石 1. 区块链底层架构的进化 跨链互操作协议:基于LayerZero协议实现以太坊、Solana等公链资产互通,通过零知…...

汇编常见指令

汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX(不访问内存)XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...

聊一聊接口测试的意义有哪些?

目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开,首…...

CSS设置元素的宽度根据其内容自动调整

width: fit-content 是 CSS 中的一个属性值&#xff0c;用于设置元素的宽度根据其内容自动调整&#xff0c;确保宽度刚好容纳内容而不会超出。 效果对比 默认情况&#xff08;width: auto&#xff09;&#xff1a; 块级元素&#xff08;如 <div>&#xff09;会占满父容器…...

【JavaSE】多线程基础学习笔记

多线程基础 -线程相关概念 程序&#xff08;Program&#xff09; 是为完成特定任务、用某种语言编写的一组指令的集合简单的说:就是我们写的代码 进程 进程是指运行中的程序&#xff0c;比如我们使用QQ&#xff0c;就启动了一个进程&#xff0c;操作系统就会为该进程分配内存…...

FFmpeg:Windows系统小白安装及其使用

一、安装 1.访问官网 Download FFmpeg 2.点击版本目录 3.选择版本点击安装 注意这里选择的是【release buids】&#xff0c;注意左上角标题 例如我安装在目录 F:\FFmpeg 4.解压 5.添加环境变量 把你解压后的bin目录&#xff08;即exe所在文件夹&#xff09;加入系统变量…...