在 JavaScript 中使用 Map 和 Set：综合指南

在 JavaScript 中使用 Map 和 Set

**Maps** 和 **Sets** 是 **ES6 (ECMAScript 2015)** 中引入的两种重要数据结构，它们比传统对象和数组提供了更强大的功能。**Maps** 和 **Sets** 都允许您存储唯一值并以更有条理、更高效的方式处理数据。

1. JavaScript 中的地图

**Map** 是键值对的集合，其中键和值都可以是任何数据类型。与只能使用字符串或符号作为键的对象不同，**Map** 允许使用任何值（对象、数组、函数等）作为键。

创建地图

要创建 Map，可以使用 `Map` 构造函数：

const map = new Map();

或者，你可以用键值对数组初始化 Map：

const map = new Map([
  ['name', 'Alice'],
  ['age', 25],
  ['city', 'New York']
]);

console.log(map);

向地图添加条目

您可以使用 `set()` 方法添加条目：

const map = new Map();

map.set('name', 'John');
map.set('age', 30);
map.set('city', 'Los Angeles');

console.log(map);

访问 Map 中的值

您可以使用 `get()` 方法访问与键关联的值：

const map = new Map([
  ['name', 'Alice'],
  ['age', 25]
]);

console.log(map.get('name'));  // Output: Alice
console.log(map.get('age'));   // Output: 25

检查 Map 中的键

要检查某个键是否存在，请使用 `has()` 方法：

const map = new Map([
  ['name', 'John'],
  ['age', 30]
]);

console.log(map.has('name'));  // Output: true
console.log(map.has('city'));  // Output: false

从地图中删除条目

您可以使用 `delete()` 方法删除键值对：

map.delete('age');
console.log(map.has('age'));  // Output: false

要清除地图上的所有条目：

map.clear();
console.log(map.size);  // Output: 0

迭代 Map

您可以使用 `forEach()` 或 `for...of` 循环迭代 Map 中的键值对：

const map = new Map([
  ['name', 'Alice'],
  ['age', 25]
]);

// Using forEach
map.forEach((value, key) => {
  console.log(key, value);
});

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

2. JavaScript 中的集合

**Set** 是唯一值的集合，这意味着它会自动删除任何重复值。与可以存储多个相同元素的数组不同，**Set** 可确保集合中的每个值都是唯一的。

创建一个集合

你可以使用 `Set` 构造函数创建一个 Set：

const set = new Set();

或者，你可以用一个值数组来初始化一个 Set：

const set = new Set([1, 2, 3, 4, 5]);
console.log(set);

向集合中添加值

您可以使用 `add()` 方法向 Set 中添加值：

const set = new Set();

set.add(1);
set.add(2);
set.add(3);
set.add(2);  // Duplicate value, won't be added

console.log(set);  // Output: Set { 1, 2, 3 }

检查集合中的值

要检查 Set 中是否存在某个值，请使用 `has()` 方法：

console.log(set.has(2));  // Output: true
console.log(set.has(4));  // Output: false

从集合中删除值

您可以使用 `delete()` 方法从 Set 中删除一个值：

set.delete(2);
console.log(set.has(2));  // Output: false

要清除集合中的所有值：

set.clear();
console.log(set.size);  // Output: 0

迭代集合

您可以使用 `forEach()` 或 `for...of` 循环迭代 Set 中的值：

const set = new Set([1, 2, 3, 4]);

// Using forEach
set.forEach(value => {
  console.log(value);
});

// Using for...of
for (const value of set) {
  console.log(value);
}

3. Map 和 Set 的比较

4. Map 和 Set 的用例

当你需要将唯一键与特定值关联时，映射非常有用。示例包括：存储用户偏好设置、存储配置选项、根据键缓存数据

当你需要存储一组唯一值时，集合是理想的选择。示例包括：跟踪网站上的唯一访问者从数组中删除重复值跟踪已处理或查看的项目

结论

地图提供高效的键值对存储，支持任何数据类型作为键，并且保持插入顺序。

集合存储唯一的值，当您想要确保集合中没有重复项时特别有用。

Maps 和 Sets 都提供了强大的功能，可以帮助您以更结构化、更高效的方式管理数据。

**嗨，我是 Abhay Singh Kathayat！**

我是一名全栈开发人员，精通前端和后端技术。我使用多种编程语言和框架来构建高效、可扩展且用户友好的应用程序。

请随时通过我的商务电子邮件联系我：kaashshorts28@gmail.com。

CLIS.CC