【Map 和 WeakMap 的区别】

简介: 【Map 和 WeakMap 的区别】

Map

1.传统对象结构

Map本质上是一个键值对的集合。和传统对象结构相比,传统对象只能用字符串作为键名,这在使用上造成了很大的限制。

const data = {}
//element为节点对象
const element = document.querySelector('.node')
console.log(element)  //输出div.node对象
console.log(element.toString())
//用点操作符不能有空格,所以采用中括号的形式给对象赋值
data[element] = 'objectData'
//输出objectData,说明在对象中存在[object HTMLDivElement]键名
console.log(data['[object HTMLDivElement]'])

上面带代码中,我们创建了一个对象并将一个节点对象作为它的键名,并进行了代码测试,首先验证了获取到的element节点为一个对象,再确定了经过toString方法转化后的结果,以这个值为键名成功的输出了value值objectData。


上面的代码证明了传统对象的键名会通过toString方法转化为字符串类型


注意:在我们访问对象成员的时,键名有空格时不能采用点访问,例如data.ab c 这是错误的。我们可以用data['ab c']的形式访问

2.Map结构


Map类似于对象,但是键名不限于字符串,可以说Object结构提供键值对应,Map提供值值对应,因此采用Map结构会优于传统对象。

const dataMap = new Map()
const element = document.querySelector('.node')
dataMap.set(element,'objectData')
console.log(dataMap.get(element))
console.log(dataMap)

上面的代码中我们获取值时直接传入了element对象,成功将对象作为键名,弥补了传统对象的不足。

3.Map的特点

  1. Map默认情况下不包含任何键,所有键都是自己添加进去的。不同于Object原型链上有一写默认的键。
  2. Map的键可以时任何类型数据,就连函数都可以。
  3. Map的键值对个数可以轻易通过size属性获取,Object需要手动计算。
  4. Map在频繁增删键值对的场景下性能比Object更好。

4.什么时候用Map


  1. 想要添加的键值名和Object上的默认键值名冲突,又不想改名,用Map。
  2. 需要String和Symbol以外的数据类型做键值时,用Map。
  3. 键值对很多,有时需要计算数量,用Map。
  4. 需要频繁地增删键值对时,用Map。

WeakMap

什么是WeakMap

WeakMap是ES6中新增的一种集合类型,叫做'弱映射'。它和Map是兄弟关系,与Map的区别在于这个弱字,API还是Map那套API


WeakMap的特性


1. WeakMap只能将对象作为键名


只接受对象作为键名(null除外),不接受其它类型的值作为键名。


2.WeakMap的键名引用的对象是弱引用


首先我们需要知道什么是强引用什么是弱引用


强引用

const dataMap = new Map()
const element = document.querySelector('.node')
dataMap.set(element,'objectData')
console.log(dataMap.get(element))
console.log(dataMap)

上面的代码中e1和e2是两个对象,通过arr数组对这两个对象添加一些文字说明。但是这样就形成了arr对e1和e2的引用,而这种引用又是强引用。它的区别就体现在这。当我们不再需要这两个对象时,我们必须手动删除这个引用,接触arr对两个对象的引用关系,否则垃圾回收机制不会释放e1和e2占用的内存。因为arr仍然存在着对对象的引用。

arr[0] = null;
arr[1] = null;

弱引用


是指不能确保其引用的对象不会被垃圾回收器回收的引用。一个对象若只被弱引用所引用,则被认为是不可访问的,并因此可能在任何时刻被回收。


也就是说当我们创建一个弱引用的对象时,我们就可以静静地等待其被垃圾回收器回收。


总的来说,局势WeakMap保持了对键名所引用对象的弱引用,即垃圾回收机制不将该引用考虑在内。只要所引用的对象的其它引用都被清除,垃圾回收机制就会释放该对象所占用的内存。也就是说,一旦不再需要,WeakMap里面的键名对象和所对应的键值对会自动消失,不需要手动删除引用。


3.不可遍历


正因为WeakMap对键名引用的对象是弱引用关系 ,因此WeakMap内部成员是会取决于垃圾回收机制有没有执行,运行前后成员个数很可能是不一样的,而垃圾回收机制的执行又是不可预测的,因此不可遍历。

Map和WeakMap区别

Map的键可以是任意类型,WeakMap只接受对象作为键,不接受其它类型的值作为键

Map的键实际上是跟内存地址绑定的,只要内存地址不一样,就视为两个键;WeakMap的键是弱引用,键所指向的对象是可以被垃圾回收,此时键是无效的。

Map可以被遍历,WeakMap不能被遍历


相关文章
|
6月前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
103 3
|
6月前
|
JavaScript 前端开发 索引
问js的forEach和map的区别
JavaScript中的`forEach`和`map`都是数组迭代方法。`forEach`遍历数组但不修改原数组,无返回值;它接受回调函数处理元素。`map`则遍历数组并返回新数组,新数组元素为回调函数处理后的结果。两者都接收元素、索引和数组作为回调函数参数。
54 7
|
1月前
|
存储 JavaScript 前端开发
Set、Map、WeakSet 和 WeakMap 的区别
在 JavaScript 中,Set 和 Map 用于存储唯一值和键值对,支持多种操作方法,如添加、删除和检查元素。WeakSet 和 WeakMap 则存储弱引用的对象,有助于防止内存泄漏,适合特定场景使用。
|
1月前
|
存储 缓存 Java
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
38 1
WK
|
2月前
|
Python
map和filter的区别是什么
`map()`和`filter()`均为Python中的高阶函数,前者针对可迭代对象中的每个元素执行指定操作,如数值翻倍或字符串转大写;后者则筛选出符合条件的元素,例如仅保留偶数或非空字符串。两者均返回迭代器,并可通过`list()`等函数转换为所需的数据结构。具体使用时,应依据实际需求和场景选择合适的函数。
WK
19 1
WK
|
2月前
map和filter的区别是什么
在编程中,`map` 和 `filter` 是处理数组或集合时常用的两个函数。`map` 用于将每个元素通过指定函数转换后生成新的数组,而 `filter` 则根据条件筛选出符合条件的元素组成新数组。两者的主要区别在于:`map` 的返回数组长度与原数组相同,但元素被转换;`filter` 的返回数组长度可能不同,只包含符合条件的元素。
WK
31 2
|
2月前
数组方法中的`forEach()`方法和`map()`方法有什么区别?
数组方法中的`forEach()`方法和`map()`方法有什么区别?
|
3月前
|
Java
【Java集合类面试二十二】、Map和Set有什么区别?
该CSDN博客文章讨论了Map和Set的区别,但提供的内容摘要并未直接解释这两种集合类型的差异。通常,Map是一种键值对集合,提供通过键快速检索值的能力,而Set是一个不允许重复元素的集合。
|
3月前
|
分布式计算 Serverless 数据处理
|
3月前
|
存储 Java 索引