简介:
new Map(): 在JavaScript中,new Map()用于创建一个新的 Map 对象。Map 对象是一种键值对的集合,其中的键是唯一的,值可以重复。
new Set(): 在JavaScript中, new Set() 是用来创建一个新的 Set 对象的语法。Set 对象是一种集合,其中的值是唯一的,没有重复的值。 new Set() 可以用来创建一个空的 Set 对象,在创建时传入一个数组或类数组对象,Set 会自动去除重复的值。
new Map()
一、new Map() 基本特性
new Map() 是用来创建一个新的 Map 对象的构造函数。Map 对象保存键值对,并记住键的原始插入顺序。这意味着你可以迭代 Map 对象,按键的插入顺序获取键值对。

Map 对象与普通的对象(使用字符串作为键)不同,因为 Map 可以使用任何类型作为键(包括函数、对象或任何原始值),而不仅仅是字符串或符号。

二、相关方法
1. set(key, value) : 向 Map 对象中添加一个键值对。
2. get(key) : 获取指定键对应的值。
3. has(key) : 判断 Map 对象中是否存在指定的键。
4. delete(key) : 删除指定键及其对应的值。
5. size : 返回 Map 对象中键值对的数量。
6. clear() : 清空 Map 对象中的所有键值对。
7. keys() : 返回一个包含 Map 对象中所有键的迭代器。
8. values() : 返回一个包含 Map 对象中所有值的迭代器。
9. entries() : 返回一个包含 Map 对象中所有键值对的迭代器。
三、基本使用

// 创建一个新的Map对象
let myMap = new Map(); // 1、添加键值对
myMap.set('name', 'Alice');
myMap.set('age', 25); // 2、获取值
console.log(myMap.get('name')); // 输出: "Alice" // 3、检查键是否存在
console.log(myMap.has('age')); // 输出: true // 4、删除键值对
myMap.delete('name');
console.log(myMap.has('name')); // 输出: false // 5、获取Map的大小
console.log(myMap.size); // 输出: 1 // 6、清空Map
myMap.clear();
console.log(myMap.size); // 输出: 0 // 7、遍历键
for (let key of myMap.keys()) {
console.log(key); // 输出: "age"
} // 8、遍历值
for (let value of myMap.values()) {
console.log(value); // 输出: 25
} // 9、遍历键值对
for (let [key, value] of myMap.entries()) {
console.log(`Key: ${key}, Value: ${value}`); // 输出: Key: age, Value: 25
}

new Set()
一、new Set() 基本特性
唯一性:在 Set 中,每个值只出现一次,可以实现简单的数组去重,即使是两个完全相同的对象,它们在 Set 中也只会被存储一次。
无序性:Set 中的元素没有特定的顺序。
二、相关方法
add(value): 向 Set 对象中添加一个值。如果值已存在,则不会进行任何操作。
delete(value): 从 Set 对象中删除一个值。如果值存在,则删除并返回 true;否则,返回 false。
has(value): 返回一个布尔值,表示 Set 对象中是否包含指定的值。
clear(): 清空 Set 对象,移除所有元素。
三、基本使用

let setData = new Set();  

// 添加元素
setData .add(1);
setData .add(2);
setData .add(3);
console.log(setData); // setData { 1, 2 ,3 } // 删除元素
setData.delete(2);
console.log(setData); // Set { 1, 3 } // 检查元素是否存在
console.log(setData.has(1)); // true
console.log(setData.has(4)); // false // 遍历元素
setData.forEach(value => console.log(value));
// 输出:
// 1
// 3 // 清空集合
setData.clear();
console.log(setData.size); // 输出: 0,因为集合已被清空 //在创建 Set 时直接传入一个可迭代对象(如数组),来初始化 Set:
let set = new Set([1, 2, 2, 3, 4, 4]);
//简单数组去重
console.log(set); // Set { 1, 2, 3, 4 }

JavaScript中的new map()和new set()使用详细(new map()和new set()的区别)的更多相关文章

  1. JavaScript中Function Declaration与Function Expression 或者说 function fn(){}和var fn=function(){} 的区别

    JavaScript是一种解释型语言,函数声明会在JavaScript代码加载后.执行前被解释,而函数表达式只有在执行到这一行代码时才会被解释. 在JS中有两种定义函数的方式, 1是:var aaa= ...

  2. javascript中 for循环的一些写法 for length 以及for in 还有 for of 的区别

    最近在写一些前端的代码,遇到一个产品列表遍历的问题,正好使用到for 的几种用法,于是研究了下. 代码如下,先说明下goodslist 是一个产品列表 形如这样的数据格式 { ‘types’:1, ' ...

  3. JavaScript中setInterval常见的问题(setInterval第一个参数加引号与不加引号区别)

  4. javascript中面向对象的两种构建方式(构造函数)和(原型模式的区别)

    1.构造函数模式--->alert的结果为false <!DOCTYPE html> <html lang="en"> <head> &l ...

  5. JavaScript中对象的属性

    在JavaScript中,属性决定了一个对象的状态,本文详细的研究了它们是如何工作的. 属性类型 JavaScript中有三种不同类型的属性:命名数据属性(named data properties) ...

  6. javascript中的undefined与null的区别

    一.相似性 在JavaScript中,将一个变量赋值为undefined或null,老实说,几乎没区别. var a = undefined; var a = null; 上面代码中,a变量分别被赋值 ...

  7. 【转】javascript中not defined、undefined、null以及NaN的区别

    原文链接(点击跳转) 第一:not defined 演示代码:   <span style="font-size:12px;"><span style=" ...

  8. ES6新特性:Javascript中的Map和WeakMap对象

    Map对象 Map对象是一种有对应 键/值 对的对象, JS的Object也是 键/值 对的对象 : ES6中Map相对于Object对象有几个区别: 1:Object对象有原型, 也就是说他有默认的 ...

  9. 由实现JavaScript中的Map想到的

    项目中要用到JavaScript中的Map数据类型,它不像JDK那样有自带的,怎么办?搜了找到一个不错的(http://darkmasky.iteye.com/blog/454749).用这个可以满足 ...

  10. JavaScript中Map和ForEach的区别

    译者按: 惯用Haskell的我更爱map. 原文: JavaScript — Map vs. ForEach - What’s the difference between Map and ForE ...

随机推荐

  1. Maven工程报错org.codehaus.plexus.component.repository.exception.ComponentLookupException

    本人电脑环境:jdk1.8,idea2021,maven 3.6.3 问题:今天调整maven项目的三个配置参数后,idea报了下面的错误 org.codehaus.plexus.component. ...

  2. 【论文笔记】ResNet深度残差网络

    [深度学习]总目录 深度残差网络(ResNet)由微软研究院的何恺明.张祥雨.任少卿.孙剑提出.研究动机是为了解决深度网络的退化问题,不同于过去的网络是通过学习去拟合一个分布,ResNet通过学习去拟 ...

  3. itestwork(爱测试) 开源一站式接口测试&敏捷测试工作站 9.0.2Rc2发布

    (一)itest 简介 itest work (爱测试)  一站式工作站让测试变得简单.敏捷,"好用.好看,好敏捷" ,是itest wrok 追求的目标.itest work 包 ...

  4. Apisix网关-使用Grafana可视化Apisix的Prometheus数据

    Apisix安装部署 Apisix官网安装教程 Apisix Dashboard官网安装教程 本次教程使用RPM包安装方式 使用systemctl管理服务 Apisix配置要点 /usr/local/ ...

  5. lazyload图片懒加载

    安装 npm i -S vue-lazyload 在src/main.js文件中添加如下内容 import VueLazyload from 'vue-lazyload' Vue.use(VueLaz ...

  6. [SWPUCTF 2021 新生赛]gift_F12

    首先我们打开环境会发现花里胡哨的,而题目中有提示:F12,所以我们直接F12查看源码 然后ctrl+f信息检索flag.直接找到flag提交 但要注意提交格式为NSSCTF{}

  7. INFINI Labs 产品更新 | Easysearch 新增 kNN 搜索功能、Console 支持 LDAP 认证登录等

    INFINI Labs 产品又更新啦~,包括 Easysearch v1.3.0.Gateway v1.16.0.Console v1.4.0.Agent v0.5.1.本次产品更新了许多实用新特性, ...

  8. 手机上玩 PC 游戏的开源项目「GitHub 热点速览」

    上周国产 3A 大作<黑神话:悟空>开启预售,同时公布游戏将于北京时间 2024.8.20 正式上线.这是一款由「游戏科学」开发的西游题材单机·动作·角色扮演游戏,它采用「虚幻引擎5」制作 ...

  9. ssh练习

    根据要求完成部署 根据如下要求,完成部署过程 1.恢复7.8.9.31.41所有机器的快照 7 8 9 web服务 nginx ​ 172.16.1.xx ​ ​ nfs-31 提供共享文件存储 ​ ...

  10. 这几个必备的vscode插件,你安装了几个

    作为一名前端开发者,vscode想必大家应该都接触过,就像大多数 IDE 一样,VSCode 也有一个扩展和主题市场,包含了数以千计质量不同的插件. 作为一名熟练掌握各种前端开发工具安装和卸载的大师兄 ...