【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.hqwc.cn/news/701915.html

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

相关文章

数据可视化训练第7天(json文件读取国家人口数据,找出前10和后10)

数据 https://restcountries.com/v3.1/all;建议下载下来,并不是很大 import numpy as np import matplotlib.pyplot as plt import requests import json #由于访问url过于慢;将数据下载到本地是json数据 #urlhttps://restcountries.com/v3…

【java】异常与错误

Throwable包括Error和Expected。 Error Error错误是程序无法处理的,由JVM产生并抛出的。 举例:StackOverflowError \ ThreadDeath Expected Expected异常包括两类,即受检异常(非运行时异常)和非受检异常(运行时异常),异常往往…

海豚调度器如何看工作流是在哪个worker节点执行

用海豚调度器,执行一个工作流时,有时成功,有时失败,怀疑跟worker节点环境配置不一样有关。要怎样看是在哪个worker节点执行,在 海豚调度器 Web UI 中,您可以查看任务实例,里面有一列显示host&a…

太阳能光伏发电应用过程中会用到哪些光伏组件?

随着全球对可再生能源的需求日益增加,太阳能光伏发电已成为一种重要的清洁能源解决方案。在太阳能光伏发电系统的运行过程中,光伏组件作为系统的核心部分,起着至关重要的作用。本文将详细介绍太阳能光伏发电应用过程中会使用到的关键光伏组件…

Nginx 生产环境部署的最佳实践

你好呀,我是赵兴晨,文科程序员。 最近一段时间,我一直在和大家一起探讨Nginx的相关话题。期间,我收到了很多小伙伴的私信,他们好奇地问我:在生产环境中,Nginx应该如何配置? 他们在…

Github20K星开源团队协作工具:Zulip

Zulip:让团队协作的每一次交流,都精准高效。- 精选真开源,释放新价值。 概览 随着远程工作的兴起和团队协作的需求不断增加,群组聊天软件成为了日常工作中不可或缺的一部分。Zulip 是github上一个开源的团队协作工具,…

游戏行业被攻击的原因、攻击种类及合适的服务器

很多游戏刚上线没多久就频繁遭到同行恶意攻击。在相关数据报告中,2023年上半年遭受DDoS攻击的行业中,游戏行业占到40%,而且攻击方式、攻击频率、攻击峰值呈明显上升趋势。很多充满创意的游戏开发公司刚才开发上线一个很有特色的产品&#xff…

【回溯】1240. 铺瓷砖

本文涉及知识点 回溯 LeetCode1240. 铺瓷砖 你是一位施工队的工长,根据设计师的要求准备为一套设计风格独特的房子进行室内装修。 房子的客厅大小为 n x m,为保持极简的风格,需要使用尽可能少的 正方形 瓷砖来铺盖地面。 假设正方形瓷砖的…

java项目之实验室管理系统(springboot+vue+mysql)

风定落花生,歌声逐流水,大家好我是风歌,混迹在java圈的辛苦码农。今天要和大家聊的是一款基于springboot的实验室管理系统。项目源码以及部署相关请联系风歌,文末附上联系信息 。 项目简介: 实验室管理系统的主要使用…

详解JS的URL()和URLSearchParams() API接口

两个 API 接口定义 URL() 构造函数返回一个新创建的 URL 对象,表示由一组参数定义的 URL。 URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。 快速了解两个 API 在哪里用 以前我们要对地址栏中的 URL 地址进行分析处理,需要自己进…

免费思维13招之十一:利润型思维

免费思维13招之十一:利润型思维 免费思维的另一大战略思维——利润型思维。 什么是利润型思维呢?就是用后期的利润来支付现在的成本。也就是“花未来的钱,办现在的事”。 我们在销售自己的产品时候,最容易犯的一个件事,就是降价,我们先来看一个案例: 前几年,有一个卖…

如何管理多个版本的Node.js

我们如何在本地管理多个版本的Node.js,有没有那种不需要重新安装软件再修改配置文件和环境变量的方法?经过我的查找,还真有这种方式,那就是nvm(Node Version Manager)。 下面我就给大家介绍下NVM的使用 1…