ES6 Set、Map、WeakSet、WeakMap 四者辨析与实战应用详解

在 ES6 中，Set 和 Map 是两种非常重要的新增数据结构，它们都具有独特的特性和用途，能够帮助开发者更高效地处理和管理数据。除此之外，WeakSet 和 WeakMap 作为这两种数据结构的变种，也具有一些特殊的功能。下面我会从 Set 数据结构、Map 数据结构、WeakSet 和 WeakMap 对比等方面，结合实际项目代码示例进行详细分析。

1. Set 数据结构

1.1 Set 的基本概念

Set 是一种新的集合类型，它与传统的数组类似，但有以下几点不同：

• 元素唯一：Set 中的元素不能重复。
• 元素的顺序：Set 中的元素是有顺序的，按插入顺序进行遍历。
• 无索引：与数组不同，Set 中没有元素的索引，元素通过迭代访问。

1.2 Set 的常用操作

• add(value)：添加元素。
• has(value)：检查 Set 中是否存在某个元素。
• delete(value)：删除某个元素。
• clear()：清空 Set 中的所有元素。
• size：返回 Set 中元素的个数。
• 遍历：可以使用 forEach 方法遍历 Set 中的元素，或者使用 for...of 循环。

1.3 Set 的示例

const set = new Set();// 添加元素
set.add(1);
set.add(2);
set.add(3);
set.add(2);  // 不会添加重复元素console.log(set);  // 输出: Set { 1, 2, 3 }// 检查是否存在某个元素
console.log(set.has(2));  // 输出: true
console.log(set.has(4));  // 输出: false// 删除元素
set.delete(2);
console.log(set);  // 输出: Set { 1, 3 }// 遍历 Set
set.forEach(value => console.log(value));  // 输出: 1 3

1.4 Set 的实际应用场景

在实际项目中，Set 可以用于去重、数据存储、集合运算等。

例如：去重数组中的重复元素