详解JavaScript中的Map和WeakMap
更新时间：2023年08月31日 08:37:40 作者：编程三昧
Map和WeakMap都是ES6中新增的数据结构,它们的主要区别在于键的作用域和键的类型,本文就通过代码示例给大家详细介绍了JavaScript键的作用域和类型,需要的朋友可以参考下
键的作用域
Map 的键的作用域是全局的，也就是说，Map 中的键不会被污染，也不会对其他的变量产生影响。而 WeakMap 的键的作用域是局部的，也就是说，WeakMap 中的键只在定义它的函数作用域内有效，一旦函数执行完毕，WeakMap 中的键就会被释放。
键的类型
Map 的键可以是任意类型的值，包括对象、数组、函数等等。而 WeakMap 的键只能是对象，因为 WeakMap 是通过引用计数来管理键的，如果键不是对象，就无法计数。
下面是一个使用 Map 和 WeakMap 的示例代码：
// 使用 Map 存储数据
const map = new Map();
map.set("a", 1);
map.set("b", 2);
map.set("c", 3);
// 使用 WeakMap 存储数据
const weakMap = new WeakMap();
const obj1 = {};
const obj2 = {};
weakMap.set(obj1, 1);
weakMap.set(obj2, 2);
weakMap.set(obj1, 3);
console.log(map.get("a")); // 1
console.log(map.get("b")); // 2
console.log(map.get("c")); // 3
console.log(weakMap.get(obj1)); // 3
console.log(weakMap.get(obj2)); // 2键的可枚举性
与Map对象不同的是，WeakMap的键是不可枚举的。不提供列出其键的方法。列表是否存在取决于垃圾回收器的状态，是不可预知的。
总结
如果有需要遍历键值对的需求，则需要使用 Map。
到此这篇关于详解JavaScript中的Map和WeakMap的文章就介绍到这了,更多相关JavaScript Map和WeakMap内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
在JavaScript中循环迭代数组的方法有很多种,下面这篇文章主要给大家介绍了关于如何在JavaScript中使用map()迭代数组的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-02-02
vue element loading遮罩层添加按钮功能实现
这篇文章主要介绍了vue element loading遮罩层添加按钮功能实现,通过实例代码补充介绍了vue+elementui的this.$loading遮罩使用方法,需要的朋友可以参考下2024-03-03
这篇文章主要介绍了js作用域和作用域链及预解析，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
简单的分页代码js实现，分享给大家，感兴趣的小伙伴们可以参考一下2016-05-05
延迟加载的函数，第一次调用后，会覆盖原来的老函数，以后再次调用的是新函数，不会再进行条件的判断，提升效率2012-10-10
本文主要介绍了js实现音频控制进度条功能的示例代码。具有很好的参考价值。下面跟着小编一起来看下吧2017-04-04
这篇文章主要介绍了JavaScript判断输入是否为数字类型的方法总结的相关资料,希望通过本文能帮助到大家，需要的朋友可以参考下2017-09-09
FingerprintJS是基于JS的浏览器指纹库,通过采集设备属性生成唯一用户标识,这篇文章主要介绍了fingerprint.js的安装及基本使用方法的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2025-06-06
这篇文章主要介绍了jQuery多项选项卡的实现思路,需要的朋友可以参考下2014-06-06
TypeScript是Javascrip t超集,支持静态类型检测,可以在编译期提前暴露问题,节省debug时间,下面这篇文章主要给大家介绍了关于TypeScript开发的6六个实用小技巧,需要的朋友可以参考下2021-09-09
最新评论