ES6 中的高效数据管理工具：Set 和 Map

在 JavaScript 日新月异的发展中，ES6（ECMAScript 2015）带来了许多新特性与数据结构，极大地丰富了我们的编程工具箱。其中Set 和 Map 是两个非常重要的数据结构，它们提供了更强大、更灵活的方式来处理集合和键值对。在这篇文章中，我们将深入探讨 Set 和 Map 的核心概念、使用方法以及应用场景，还包括它们的弱引用版本 WeakSet 和 WeakMap。

Set

Set 的基本概念

Set 是一种新的集合类型，用于存储不重复的值。它类似于数组，但不同之处在于 Set 中的每一个值都是唯一的，没有重复的值。

Set 的基本用法

创建一个 Set

你可以通过以下方式创建一个 Set：

const mySet = new Set();

你也可以使用一个数组来初始化 Set：

const mySet = new Set([1, 2, 3, 4, 4, 5]);
console.log(mySet); // 输出：Set { 1, 2, 3, 4, 5 }

添加和删除元素

使用 add() 方法可以向 Set 中添加元素，使用 delete() 方法可以删除元素：

mySet.add(6);
console.log(mySet); // 输出：Set { 1, 2, 3, 4, 5, 6 }

mySet.delete(2);
console.log(mySet); // 输出：Set { 1, 3, 4, 5, 6 }

检查元素是否存在

使用 has() 方法可以检查某个值是否存在于 Set 中：

console.log(mySet.has(3)); // 输出：true
console.log(mySet.has(2)); // 输出：false

获取 Set 的大小

使用 size 属性可以获取 Set 中元素的数量：

console.log(mySet.size); // 输出：5

遍历 Set

可以使用 forEach() 方法或 for...of 循环来遍历 Set：

mySet.forEach(value => {
  console.log(value);
});

for (const value of mySet) {
  console.log(value);
}

Set 的应用场景

在一些算法题中，我们能经常的用上。

• 去重：Set 最常见的用途之一是去除数组中的重复元素。

const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [...new Set(array)];
console.log(uniqueArray); // 输出：[1, 2, 3, 4, 5]

• 集合操作：Set 提供了一种简单的方式来实现集合的并集、交集和差集等操作。

const setA = new Set([1, 2, 3, 4]);
const setB = new Set([3, 4, 5, 6]);

// 并集
const union = new Set([...setA, ...setB]);
console.log(union); // 输出：Set { 1, 2, 3, 4, 5, 6 }

// 交集
const intersection = new Set([...setA].filter(x => setB.has(x)));
console.log(intersection); // 输出：Set { 3, 4 }

// 差集
const difference = new Set([...setA].filter(x => !setB.has(x)));
console.log(difference); // 输出：Set { 1, 2 }

Map

Map 的基本概念

Map 是一种新的键值对集合类型，它类似于对象，但 Map 的键可以是任意类型，而对象的键只能是字符串。弥补传统对象只能用字符串做key的缺陷。

Map 的基本用法

创建一个 Map

你可以通过以下方式创建一个 Map：

const myMap = new Map();

你也可以使用数组初始化 Map，每个数组元素应是一个包含两个元素的数组，分别表示键和值：

const myMap = new Map([
  ['name', 'Alice'],
  ['age', 25]
]);
console.log(myMap); // 输出：Map { 'name' => 'Alice', 'age' => 25 }

设置和获取元素

使用 set() 方法可以设置键值对，使用 get() 方法可以获取对应的值：

myMap.set('city', 'New York');
console.log(myMap.get('city')); // 输出：New York

检查键是否存在

使用 has() 方法可以检查某个键是否存在于 Map 中：

console.log(myMap.has('name')); // 输出：true
console.log(myMap.has('country')); // 输出：false

删除元素

使用 delete() 方法可以删除某个键值对：

myMap.delete('age');
console.log(myMap); // 输出：Map { 'name' => 'Alice', 'city' => 'New York' }

获取 Map 的大小

使用 size 属性可以获取 Map 中键值对的数量：

console.log(myMap.size); // 输出：2

遍历 Map

可以使用 forEach() 方法或 for...of 循环来遍历 Map：

myMap.forEach((value, key) => {
  console.log(key, value);
});

for (const [key, value] of myMap) {
  console.log(key, value);
}

Map 的应用场景

• 缓存数据：Map 可以用来缓存频繁访问的数据，避免重复计算。

const cache = new Map();

function getCachedData(key) {
  if (cache.has(key)) {
    return cache.get(key);
  } else {
    // 假设 fetchData 是一个耗时的计算
    const data = fetchData(key);
    cache.set(key, data);
    return data;
  }
}

• 存储复杂键值对：Map 可以用来存储复杂的键值对，特别是当键不是字符串类型时。

const complexKeyMap = new Map();
const keyObj = {};
complexKeyMap.set(keyObj, 'hello world');
console.log(complexKeyMap.get(keyObj)); // 输出：hello world

特殊的 Set 和 Map

ES6不仅引入了Set和Map，还引入了它们的弱引用版本------WeakSet和WeakMap。这些数据结构具有一些独特的特性和用途，尤其在内存管理和垃圾回收方面。

什么是弱引用

弱引用 （是一种特殊的引用，它允许垃圾回收机制在没有其他强引用时回收这个对象。

想象你在图书馆里借了一本书，这本书非常受欢迎，所以书架管理员一直关注着它，只要有人借走这本书，他就会记录在案，确保这本书不会丢失。这种情况就像是一个强引用，管理员（引用）确保这本书（对象）不会被移走（回收）。

现在，假设你借了一本书，但这本书并不热门，管理员对它不是特别在意。如果有一天，图书馆需要腾出空间来放新书，管理员发现这本书没有人在意，就会把它收回。这种情况就像是一个弱引用。管理员只是随意记录了这本书的借出情况，当需要腾出空间时，他会毫不犹豫地回收这本书。

换句话说，如果一个对象只有弱引用，没有任何强引用，那么这个对象在需要释放内存时，可以被垃圾回收机制回收。

WeakSet

WeakSet 是一种特殊的 Set，它只存储对象，并且这些对象都是弱引用的，即如果没有其他引用指向这些对象，它们可以被垃圾回收。

let weakSet = new WeakSet();
let obj = { name: 'Alice' };

weakSet.add(obj);
console.log(weakSet.has(obj)); // 输出：true

obj = null; // 删除对对象的强引用
// 由于 weakSet 中对 obj 的引用是弱引用，垃圾回收器可以回收这个对象

在这个例子中，我们创建了一个 WeakSet 并向其中添加了一个对象。当我们把 obj 变量设置为 null 时，我们删除了对该对象的强引用。由于 WeakSet 中对这个对象的引用是弱引用，垃圾回收器可以回收这个对象。

WeakMap

WeakMap 是一种特殊的 Map，它的键必须是对象，并且这些键都是弱引用的，即如果没有其他引用指向这些对象，它们可以被垃圾回收。

let weakMap = new WeakMap();
let key = { id: 1 };
let value = { name: 'Alice' };

weakMap.set(key, value);
console.log(weakMap.get(key)); // 输出：{ name: 'Alice' }

key = null; // 删除对 key 的强引用
// 由于 weakMap 中对 key 的引用是弱引用，垃圾回收器可以回收这个键值对

在这个例子中，我们创建了一个 WeakMap 并设置了一个键值对。当我们把 key 变量设置为 null 时，我们删除了对该键的强引用。由于 WeakMap 中对这个键的引用是弱引用，垃圾回收器可以回收这个键值对。

弱引用的用途

• 内存优化：在某些情况下，你可能需要临时存储一些对象，而不希望这些对象因为被引用而无法被回收。弱引用允许这些对象在内存不足时被回收，从而优化内存使用。
• 缓存：弱引用可以用于实现缓存机制，当内存紧张时，缓存的对象可以被自动回收，防止内存泄漏。
• DOM 操作：在浏览器中处理 DOM 节点时，使用弱引用可以防止内存泄漏。例如，在事件监听器中使用弱引用，可以确保当节点被删除时，相关的内存也能被回收。

结论

Set 和 Map 提供了更强大、更灵活的数据结构，用于处理不重复的值和键值对。而WeakSet 和 WeakMap，它们在内存管理和垃圾回收方面有着独特的优势。通通过理解和掌握这些新特性，我们可以编写出更加简洁、高效且易于维护的代码。希望本文能帮助你更好地理解和应用 Set 和 Map。