JavaScript ES6 全新的Set、Map数据结构

JavaScript ES6 全新的Set、Map数据结构

Map、Set都是ES6新的数据结构, 都是新的内置构造函数, 也就是说typeof的结果, 多了两个:

Set 是不能重复的数组, 但不能[某一项来枚举出来]

Map 是可以任何东西当做键的对象

set()数据结构

ES6 提供了新的数据结构 Set。它类似于数组, 但是成员的值都是唯一的, 没有重复的值。

let s = new Set();
s.add(1);
s.add(2);
s.add(3);
s.add(3);
s.add(3);
s.add(4);
s.add(5);
console.log(s) //Set { 1, 2, 3, 4, 5, 6 }

集合中添加数据用add()方法, 会自动过滤已经有的元素。

最快的数组去重方法, 转化为数组:

let s = new Set([1,2,3,3,3,4,5]);
console.log([...s]) //[ 1, 2, 3, 4, 5 ]
let s = new Set([1,2,3,4,5]);
console.log(s.size) // 5
console.log(s.has(5)) // true
console.log(s.delete(5)) // true
console.log(s) // Set { 1, 2, 3, 4 }

集合的关注点是在元素里面, 而不关注顺序, 所以不提供s[0]来枚举某项API, 但是可以转为数组[...s]

Map()数据结构

JavaScript 的对象(Object), 本质上是键值对的集合(Hash 结构), 但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。

为了解决这个问题, ES6 提供了 Map 数据结构。它类似于对象, 也是键值对的集合, 但是"键"的范围不限于字符串, 各种类型的值(包括对象)都可以当作键。

也就是说, Object 结构提供了"字符串—值"的对应, Map 结构提供了"值—值"的对应, 是一种更完善的 Hash 结构实现。如果你需要"键值对"的数据结构, Map 比 Object 更合适。

let m = new Map();
const o = {a:1,b:2};
m.set("haha", 123);
m.set(o, 456)
m.set(888,789)
console.log(m)
console.log(m.get(o)) //使用get()方法根据key获取对应的value
console.log(m.size) //获取对应的value数量

使用get()来得到元素的值, key是区分类型的。

遍历数据结构

使用for of 遍历数据结构

let m = new Map();
m.set('a', 100)
m.set('b', 200)
m.set('c', 300)
//遍历key
for(let key of m.keys()){
console.log(key);
}
//遍历value
for(let value of m.values()){
console.log(value);
}

for...of遍历key 和 value

let m = new Map();
m.set('a', 100)
m.set('b', 200)
m.set('c', 300)
for(let [key,value] of m){
console.log(key, value);
}

对象转数组

Array.from()方法用于将两类对象转为真正的数组:类似数组的对象和可遍历的对象(包括 ES6 新增的数据结构 Set 和 Map)。

let m = new Map()
m.set('a', 100)
m.set('b', 200)
m.set('c', 300)
console.log(Array.from(m)) //将m转换为正常的数组
console.log(Array.from(m.keys())) //将m的键名转换为正常的数组
console.log(Array.from(m.values())) //将m的键值转换为正常的数组

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

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

相关文章

Visual studio 2019 编程控制CH341A芯片的USB设备

1、硬件 买了个USB可转IIC、或SPI、或UART的设备,主芯片是CH341A 主要说明USB转SPI的应用,绿色跳线帽选择IIC&SPI,用到CS0、SCK、MOSI、MISO这4个引脚 2、软件 2.1、下载CH341A的驱动 点CH341A官网https://www.wch.cn/downloads/CH34…

202012青少年软件编程(Python)等级考试试卷(一级)(2)

第 1 题 【单选题】 执行语句 print(1010.0)的结果为?( ) A :10 B :10.0 C :True D :False 正确答案:C 试题解析: 第 2 题 【单选题】 Turtle 库中, 画笔绘制的速度范围为?( ) A :任意…

快速入门Pandas和NumPy数据分析

大家好,从商业智能到科学研究,数据分析在许多领域中都是一项重要技能。Python因其可读性强和强大的库生态系统而成为最受欢迎的数据分析语言之一,Pandas和NumPy是重要的基础工具,适用于任何想要分析和解释数据的人。本文将探讨如何…

Element-UI快速入门

Element-UI 是一个基于 Vue.js 的高质量 UI 组件库,专为开发者提供了一套完整的解决方案,以便他们能够更加快速、方便地构建出美观、交互性强的网页应用。无论你是前端新手,还是资深开发者,通过 Element-UI,你都能显著…

C++11:shared_ptr循环引用问题

一、shared_ptr的弊端 struct Listnode {int _val;std::shared_ptr<Listnode> _prev;std::shared_ptr<Listnode> _next;Listnode(int val ):_val(val),_prev(nullptr),_next(nullptr){}~Listnode(){cout << "~Listnode()" << endl;} }; in…

翻译《The Old New Thing》 - How do I cover the taskbar with a fullscreen window?

How do I cover the taskbar with a fullscreen window? - The Old New Thing (microsoft.com)https://devblogs.microsoft.com/oldnewthing/20050505-04/?p35703 Raymond Chen 2005年5月5日 如何用全屏窗口覆盖任务栏&#xff1f; 很多时候&#xff0c;人们总是想得太多。…

2012NOIP普及组真题 1. 质因数分解

线上OJ&#xff1a; 一本通&#xff1a;http://ybt.ssoier.cn:8088/problem_show.php?pid1957 核心思想&#xff1a; 1、题中提到&#xff1a;n是两个不同的质数的乘积&#xff0c;求最大的质数。假设 n a ∗ b na*b na∗b&#xff0c;b为最大的质因数&#xff0c;则 a为n最…

Java高级开发者的面试问题及其答案

1. 在Java中&#xff0c;怎样理解并发与并行&#xff1f; 答案&#xff1a; 并发&#xff08;Concurrency&#xff09;和并行&#xff08;Parallelism&#xff09;是多线程编程的两个核心概念&#xff0c;它们在Java中有着重要的应用。 并发指的是多个任务能在重叠的时间段内…

使用 scikit-learn 进行机器学习的基本原理-2

介绍 scikit-learn 估计器对象 每个算法都通过“Estimator”对象在 scikit-learn 中公开。 例如&#xff0c;线性回归是&#xff1a;sklearn.linear_model.LinearRegression 估计器参数&#xff1a;估计器的所有参数都可以在实例化时设置&#xff1a; 拟合数据 让我们用 nump…

springboot整合mqtt实现android推送功能

1、mqtt服务器使用emqx EMQX: The Worlds #1 Open Source Distributed MQTT Broker 2、下载安装 下载地址&#xff1a; Download EMQX 选择系统&#xff0c;版本&#xff0c;安装方法 3、springboot连接mqtt服务方法&#xff1a; 引包&#xff1a; <dependency><…

[附源码]SpringBoot+Vue网盘项目_仿某度盘

视频演示 [附源码]SpringBootVue网盘项目_仿某度盘 功能介绍 支持秒传支持视频音频播放、拖拽进度条、倍速播放等支持图片预览&#xff0c;旋转&#xff0c;放大支持多人一起上传&#xff0c;共享上传进度&#xff08;例如a上传苍老师学习资料到50%&#xff0c;突然b也上传苍老…

uniapp + uView动态表单校验

项目需求&#xff1a;动态循环表单&#xff0c;并实现动态表单校验 页面&#xff1a; <u--form label-position"top" :model"tmForm" ref"tmForm" label-width"0px" :rulesrules><div v-for"(element, index) in tmForm…

Docker依旧没有过时

【A】Docker 是一种开源的容器化平台&#xff0c;它允许开发人员将应用程序及其所有依赖项打包到一个统一的容器中&#xff0c;并在不同环境中进行部署和运行。以下是 Docker 的一些基本概念和优势&#xff1a; 容器&#xff1a;Docker 使用容器来隔离应用程序和其依赖项&#…

【信息系统项目管理师知识点速记】范围管理:确认范围

9.7 确认范围 确认范围是正式验收已完成的项目可交付成果的过程。其主要作用是使验收过程具有客观性,通过确认每个可交付成果来提高最终产品、服务或成果获得验收的可能性。确认范围过程应根据需要在整个项目期间定期开展。 1. 确认范围的步骤 确认范围应贯穿项目始终。一般…

低功耗数字IC后端设计实现典型案例| UPF Flow如何避免工具乱用Always On Buffer?

下图所示为咱们社区低功耗四核A7 Top Hierarchical Flow后端训练营中的一个案例&#xff0c;设计中存在若干个Power Domain&#xff0c;其中Power Domain2(简称PD2)为default Top Domain&#xff0c;Power Domain1&#xff08;简称PD1&#xff09;为一个需要power off的domain&…

mac/windows下安装docker,minikube

1、安装docker Get Started | Docker 下载安装docker 就行 启动后&#xff0c;就可以正常操作docker了 使用docker -v 验证是否成功就行 2、安装minikube&#xff0c;是基于docker-desktop的 2.1、点击设置 2.2、选中安装&#xff0c;这个可能需要一点时间 这样安装后&…

JavaScript实现在线屏幕录制

本文主要介绍在线屏幕录制 Demo Its sole method is MediaDevices.getDisplayMedia() !移动端暂不支持 环境要求 新版本 Chrome,Edge,Firefox 桌面浏览器 常见问题 1. navigator.mediaDevices为undefined 在不安全的情况下&#xff0c;navigator.mediaDevices是undefine…

机器学习实战 —— 工业蒸汽量预测(二)

目录 文章描述背景描述数据说明数据来源实战内容2.数据特征工程2.1数据预处理和特征处理2.1.1 异常值分析2.1.2 归一化处理2.1.3 特征相关性 2.2 特征降维2.2.1 相关性初筛2.2.2 多重共线性分析2.2.3 PCA处理降维 文章描述 数据分析&#xff1a;查看变量间相关性以及找出关键变…

面试经典算法题之双指针专题

力扣经典面试题之双指针 ( 每天更新, 每天一题 ) 文章目录 力扣经典面试题之双指针 ( 每天更新, 每天一题 )验证回文串收获 392. 判断子序列 验证回文串 思路 一: 筛选 双指针验证 class Solution { public:bool isPalindrome(string s) {// 所有大写字母 > 小写 去除非字母…

深度学习中的模块化设计

模块化设计在机器学习和深度学习领域中是一个重要的概念&#xff0c;特别是在构建和改进像编码器-解码器这样的复杂模型时。以下是模块化设计如何帮助快速集成最新研究成果的一些关键点&#xff1a; 即插即用&#xff1a;模块化设计允许研究人员将新的研究成果如新的注意力机制…