【JavaScript】WeakMap 和 WeakSet

Map

Map 用于存储键值对。

  1. 添加属性:
    使用 Map 的 set() 方法可以向 Map 对象中添加键值对。例如:

    const map = new Map();
    map.set('key1', 'value1');
    map.set('key2', 'value2');
    

    通过二维数组快速创建 map 键值对。

     let arr = [[1, 2],[2, 3],[3, 4]]let map = new Map(arr)console.log(map)  // Map(3) { 1 => 2, 2 => 3, 3 => 4 }
    
    map.keys()  // MapIterator { 1, 2, 3 }
    map.entries() // MapIterator { 1 => 2, 2 => 3, 3 => 4 }
    map.values()  // MapIterator { 2, 3, 4 }
    
  2. 获取属性和长度:
    使用 Map 的 get() 方法可以根据键获取对应的值。使用 Map 的 size 属性可以获取 Map 对象中键值对的数量。例如:

    const map = new Map();
    map.set('key1', 'value1');
    map.set('key2', 'value2');
    const value1 = map.get('key1'); // 获取键为 'key1' 的值
    const size = map.size; // 获取 Map 对象中键值对的数量
    
     let obj = {a: 1,b: 2,c: 3}console.log(Object.keys(obj).length)
    
  3. 遍历 Map 对象:
    使用 Map 的 forEach() 方法可以遍历 Map 对象的键值对。可以传入一个回调函数,对每个键值对执行相应的操作。例如:

    const map = new Map();
    map.set('key1', 'value1');
    map.set('key2', 'value2');
    map.forEach((value, key) => {console.log(key, value); // 打印每个键值对
    });
    
     console.log(map)  // Map(3) { 1 => 2, 2 => 3, 3 => 4 }for (let mapElement of map) {console.log(mapElement)  // [ 1, 2 ] // [ 2, 3 ] // [ 3, 4 ]}
    
  4. 删除属性:
    使用 Map 的 delete() 方法可以根据键删除对应的键值对。例如:

    const map = new Map();
    map.set('key1', 'value1');
    map.set('key2', 'value2');
    map.delete('key1'); // 删除键为 'key1' 的键值对
    
  5. Map 和 Object 的区别:

    • 额外的键:Map 默认情况下不包含任何键,只包含插入的键;一个 Object 有一个原型,原型链上的键名可能和自己在对象上设置的键名冲突,可以使用 Object.create(null) 创建一个没有原型的对象
    • 键的类型:Map 的键可以使用任意类型的值,包括对象、函数、NaN 等,而 Object 的键只能是 String 或 Symbol 类型。
    • 插入顺序:Map 会按照插入顺序保存键值对,而 Object 并不保证属性的顺序(无序)。
    • 迭代和大小:Map 提供了内置的迭代器和方便的方法来获取大小(使用 size 属性),而 Object 需要手动处理迭代和计算大小。
    • 性能:在需要频繁添加、删除和查找键值对的场景中,Map 的性能通常优于 Object。

WeakMap

和 Map 很相似,但会有一些差异:

  1. 引用关联和垃圾回收:WeakMap中的键是弱引用,而Map中的键是强引用。当对象(键)被垃圾回收时, Map 对象将保持引用链接,而 WeakMap 对象将丢失链接。

  2. 键类型限制:在Map中,键可以是任意类型的值,包括原始类型和对象。而在WeakMap中,键只能是对象类型。这是因为WeakMap的实现依赖于对象的引用。

  3. 迭代和大小:Map提供了迭代方法,如forEach、keys、values和entries,可以遍历Map中的键值对。而WeakMap没有提供直接的迭代方法,也没有办法获取WeakMap的大小(即键值对的数量)。

  4. 并非 Map 中所有方法都支持。WeakMap 支持的方法:delete、get、has、set。

  5. 性能:由于WeakMap中的键是弱引用,它的性能可能会受到一些限制。在大规模操作时,WeakMap的性能可能会比Map略差。此外,由于WeakMap不会保留对象的引用,它对垃圾回收的支持更好,有助于避免内存泄漏。

Set

Set 允许存储唯一的值,无论是原始值还是对象引用。

  1. 添加元素:

    • 使用 add(value) 方法向 Set 中添加元素。和 Map 一样,也是不允许添加重复值。如果该值已经存在于 Set 中,则不会重复添加。
  2. 遍历集合:

    • Set 没有提供直接访问元素的索引,因此无法通过索引来遍历。但可以使用迭代器来遍历 Set 中的元素。
    • 使用 forEach(callbackFn, thisArg) 方法迭代 Set 中的每个元素,其中 callbackFn 是回调函数,thisArg 是可选的上下文对象。
    • 使用 for...of 循环遍历 Set 中的元素。
  3. 删除元素:

    • 使用 delete(value) 方法从 Set 中删除指定的元素。如果成功删除该元素,返回 true;如果元素不存在,则返回 false
    • 使用 clear() 方法可以清空整个 Set。
  4. 应用场景:

    • 去重:Set 中的元素是唯一的,这使得它成为去除数组中重复元素的有效工具。
    let arr = [1,3,3,4,5,6,6,6]
    let unique = [...new Set(arr)]
    console.log(unique)
    
    • 并集、交集、差集
    const setA = new Set([1, 2, 3, 4]);
    const setB = new Set([3, 4, 5, 6]);// 交集
    const intersection = new Set([...setA].filter(x => setB.has(x)));
    console.log([...intersection]);  // 输出: [3, 4]// 差集
    const difference = new Set([...setA].filter(x => !setB.has(x)));
    console.log([...difference]);  // 输出: [1, 2]// 并集
    const union = new Set([...setA, ...setB]);
    console.log([...union]);  // 输出: [1, 2, 3, 4, 5, 6]
    

需要注意的是,Set 中的元素是根据其值的唯一性进行存储和比较的,因此对于对象类型的值,它们在 Set 中被视为引用而不是值本身。这意味着两个具有相同属性和值的不同对象将被视为两个不同的元素。

以下是使用 Set 的示例代码:

const set = new Set();set.add(1);
set.add(2);
set.add(3);console.log(set.size);  // 输出: 3set.forEach((value) => {console.log(value);
});// 输出:
// 1
// 2
// 3set.delete(2);
console.log(set.has(2));  // 输出: falseset.clear();
console.log(set.size);  // 输出: 0

WeakSet

WeakSet 和 Set 区别如下:

  • WeakSet 只能储存对象引用,不能存放值,而 Set 对象都可以
  • WeakSet 对象中储存的对象值都是被弱引用的,即垃圾回收机制不考虑 WeakSet 对该对象的引用,如果没有其他的变量或者属性引用这个对象值,则这个对象将会被垃圾回收掉。(不考虑该对象还存在于 WeakSet
    中),所以 WeakSet 对象里有多少个成员元素,取决于垃圾回收机制有没有运行,运行前后成员个数可能不
    一致,遍历结束之后,有的成员可能取不到,被垃圾回收了。因此ES6规定,WeakSet对象是无法被遍历的,
    也没有办法拿到它包含的所有元素。

WeakSet 能够使用的方法如下:add(), delete(), has(), clear()

如果被垃圾回收掉,WeakSet 将丢失对内部数据的访问链接。

总结

image.png

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

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

相关文章

计算机Java项目|Springboot高校心理教育辅导设计与实现

作者主页:编程指南针 作者简介:Java领域优质创作者、CSDN博客专家 、CSDN内容合伙人、掘金特邀作者、阿里云博客专家、51CTO特邀作者、多年架构师设计经验、腾讯课堂常驻讲师 主要内容:Java项目、Python项目、前端项目、人工智能与大数据、简…

yolov9训练自定义数据

1.训练yolov9,先准备好一份自定义数据.。到roboflow下载一份数据,数据格式是yolo格式。 2.到github下载yolov9源码 https://github.com/WongKinYiu/yolov9 3.为了方便配置环境,把代码上传到矩池云上面,使用云服务器 4.执行 pip i…

JSP+SQL学生成绩管理系统

Java版本:1.8 数据库:MySQL 框架:Spring Spring MVC MyBatis 服务器:Tomcat 前端解析框架:Thymeleaf 开发工具:Idea 2017 版本管理工具:Maven 版本控制工具:GitHub 经过对系统的需…

解决kali Linux安装后如何将语言修改为中文

开启虚拟机 用root用户进入终端 进入终端执行dpkg-reconfigure locales命令 选择en_US.UTF-8 UTF-8选项,按空格键将其取消。 选择zh_CN.UTF-8 UTP-8,按空格选择,按tab键选择ok。 选择zh_CN.UTF-8字符编码,按tab键选择ok&#xff0…

jQuery EasyUI textbox 值取不到问题

用textbox 存值点击修改的时候有些字段是不能更改的所以将textbox 的disabled属性设为true后 像这里的textbox disabled属性设为true是灰的 点击保存时这两个值没传 我们可以在提交保存前先将disabled属性先设为false,保存后又设为true

简单记录下:Navicat 导出表结构至 Excel

首先我们需要通过sql语句查询出相关的表结构的结构 SELECT COLUMN_NAME AS 字段名称,COLUMN_TYPE AS 字段类型,IF(IS_NULLABLENO,否,是) AS 是否必填,COLUMN_COMMENT AS 注释FROM INFORMATION_SCHEMA.COLUMNSWHERE table_schema bs-gdsAND table_name sys_menu;查询的结构如下…

软考-软件工程

软件工程概述 软件工程指的是应用计算机科学、数学及管理科学等原理,以工程化的原则和方法来解决软件 问题的工程,目的是提高软件生产率、提高软件质量、降低软件成本。 概述: 软件开发模型:指导软件开发的体系 需求分析确定软件…

OpenAI春季发布会速览,盘点近30天AI大事件

OpenAI发布会速览 北京时间5月14日凌晨1点,OpenAI在官网举行了"春季更新"活动,推出了全新的旗舰模型“GPT-4o”, 这款模型具备处理文本、图片、视频、语音的全能处理能力,能实时响应用户需求,并进行语音回应…

鸿蒙应用布局ArkUI:【其他常用布局容器和组件】介绍

其他常用布局容器和组件 创建轮播(Swiper)实现轮播图功能 开发前请熟悉鸿蒙开发指导文档:gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md点击或者复制转到。 栅格布局(GridRow/GridCol)和Grid布局类似…

练习题(2024/5/15)

1有多少小于当前数字的数字 给你一个数组 nums&#xff0c;对于其中每个元素 nums[i]&#xff0c;请你统计数组中比它小的所有数字的数目。 换而言之&#xff0c;对于每个 nums[i] 你必须计算出有效的 j 的数量&#xff0c;其中 j 满足 j ! i 且 nums[j] < nums[i] 。 以…

解决MobaXterm无法连接虚拟机问题

MobaXterm 无法连接到虚拟机可能是由于多种原因引起的。以下是一些可能的解决方法&#xff1a; 检查网络配置&#xff1a; 确保虚拟机和 MobaXterm 所在的主机在同一网络中&#xff0c;并且能够相互通信。可以尝试使用 ping 命令来测试两者之间的连通性。确保虚拟机的网络设置正…

Spring 各版本发布时间与区别

版本版本特性Spring Framework 1.01. 所有代码都在一个项目中 2. 支持核心功能IoC、AOP 3. 内置支持Hibernate、iBatis等第三方框架 4. 对第三方技术简单封装。如&#xff1a;JDBC、Mail、事务等 5. 只支持XML配置方式。6.主要通过 XML 配置文件来管理对象和依赖关系&#xff0…

时间序列预测:探索性数据分析和特征工程的实用指南

时间序列分析是数据科学和机器学习领域最广泛的主题之一:无论是预测金融事件、能源消耗、产品销售还是股票市场趋势&#xff0c;这一领域一直是企业非常感兴趣的领域。 随着机器学习模型的不断进步&#xff0c;使除了传统的统计预测方法(如回归模型、ARIMA模型、指数平滑)外&a…

Benedict Evans:Ways to think about AGI思考 AGI 的方法:

​Benedict Evans本文发布于2024 年 5 月 4 日 How do we think about a fundamentally unknown and unknowable risk, when the experts agree only that they have no idea? 当专家们一致认为他们一无所知时&#xff0c;我们如何看待根本上未知和不可知的风险&#xff1f; T…

程序验证之Dafny--证明霍尔逻辑的半自动化利器

一、What is Dafny?【来自官网介绍 Dafny 】 1)介绍 Dafny 是一种支持验证的编程语言&#xff0c;配备了一个静态程序验证器。 通过将复杂的自动推理与熟悉的编程习语和工具相结合&#xff0c;使开发者能够编写可证明正确的代码&#xff08;相对于 {P}&#xff33;{Q} 这种…

表白成功率百分百的向女朋友表白网页源代码,向女友表白HTML源代码

表白成功率百分百的向女朋友表白网页源代码&#xff0c;向女友表白HTML源代码 效果&#xff1a; 完整代码下载地址&#xff1a;向女友表白HTML源代码 <!DOCTYPE html> <!--STATUS OK--> <html><head><meta http-equiv"Content-Type" c…

玩转Matlab-Simscape(初级)-01-从一个简单模型开始学习之旅

** 玩转Matlab-Simscape&#xff08;初级&#xff09;- 01 - 从一个简单模型开始学习之旅 ** 目录 玩转Matlab-Simscape&#xff08;初级&#xff09;- 01 - 从一个简单模型开始学习之旅 前言一、从模板开始建模二、建模一个简单的连杆2.1 建模2.2 生成子系统 总结 前言 在产…

23.HashMap的put方法流程

一、put方法的流程图 二、put方法的执行步骤 首先&#xff0c;根据key值计算哈希值。然后判断table数组是否为空或者数组长度是否为0&#xff0c;是的话则要扩容&#xff0c;resize&#xff08;&#xff09;。接着&#xff0c;根据哈希值计算数组下标。如果这个下标位置为空&a…

第 397 场 LeetCode 周赛题解

A 两个字符串的排列差 模拟&#xff1a;遍历 s s s 记录各字符出现的位置&#xff0c;然后遍历 t t t 计算排列差 class Solution {public:int findPermutationDifference(string s, string t) {int n s.size();vector<int> loc(26);for (int i 0; i < n; i)loc[s…

合并K个升序链表

题目 解法一 优先级队列 思想 将每个链表中的一个节点存放到优先级队列中&#xff0c;本题采用小根堆&#xff0c;将小根堆中的根节点取出&#xff0c;插入到最终的链表中&#xff0c;并且将该节点在原链表中的下一个节点插入小根堆中&#xff08;需要向下调整&#xff09;&a…