Map和WeakMap都是ES6中新增的数据结构，用于存储键值对。他们之间有什么区别，本文给大家详细讲述下，并附上示例代码。

一、什么是Map和WeakMap？

在JavaScript中，Map和WeakMap都是用来存储键值对的数据结构。

Map是一种普通的键值对集合，可以使用任意类型的值作为键，并且可以迭代遍历其中的元素。Map中的键是强引用，即使键没有被其他对象引用，Map中的键值对也不会被回收。

WeakMap是一种特殊的键值对集合，其中的键必须是对象，而不能是基本类型的值。WeakMap中的键是弱引用，如果键没有被其他对象引用，那么键值对会被垃圾回收机制回收。WeakMap没有提供直接的遍历方法，也没有迭代器，因此无法直接遍历所有的键值对。

总的来说，Map适合存储需要长期保存键值对的情况，而WeakMap适合存储临时的键值对，并且不需要长期保存键值对的情况。

二、Map和WeakMap的区别

Map和WeakMap都是ES6中新增的数据结构，用于存储键值对。它们之间的主要区别在于对键的引用的处理方式。

1. 引用处理方式：

• - Map：Map中的键是强引用，即使键没有被其他对象引用，Map中的键值对也不会被回收。
• - WeakMap：WeakMap中的键是弱引用，如果键没有被其他对象引用，那么键值对会被垃圾回收机制回收。

2. 键的类型：

• - Map：Map的键可以是任意类型的值，包括基本类型和对象。
• - WeakMap：WeakMap的键必须是对象，而不能是基本类型的值。

3. 遍历方式：

• - Map：Map可以通过forEach()方法或迭代器进行遍历。
• - WeakMap：WeakMap没有提供直接的遍历方法，也没有迭代器，因此无法直接遍历所有的键值对。

Map适合存储键值对，并且需要长期保存键值对的情况，而WeakMap适合存储临时的键值对，并且不需要长期保存键值对的情况。

三、示例代码

当使用Map时，我们可以这样创建一个Map并操作它：

// 创建一个Map
let myMap = new Map();

// 添加键值对
let key1 = "key1";
let value1 = "value1";
myMap.set(key1, value1);

// 获取值
console.log(myMap.get(key1)); // 输出: value1

// 使用迭代器遍历
for (let [key, value] of myMap) {
  console.log(key + " = " + value);
}

当使用WeakMap时，我们可以这样创建一个WeakMap并操作它：

// 创建一个WeakMap
let myWeakMap = new WeakMap();

// 创建一个对象作为键
let keyObj = {};
let value2 = "value2";

// 添加键值对
myWeakMap.set(keyObj, value2);

// 获取值
console.log(myWeakMap.get(keyObj)); // 输出: value2

需要注意的是，由于WeakMap的键必须是对象，因此不能像Map那样直接使用基本类型的值作为键。

大千UI工场→10年UI设计老和前端开发老司机，持续为大家分享有价值、有见地的观点、作品、干货，欢迎评论、关注、点赞、有事您私信。