在 JavaScript 中，我们经常需要使用一些数据结构来存储和操作数据。ES2021 引入了两个新的数据类型 Map 和 Set，它们可以让我们更方便地操作数据，提高代码的可读性和性能。本文将介绍如何在 ES2021 中使用 Map 和 Set。
Map
Map 是一种键值对的集合，它类似于对象，但它的键可以是任何类型，而不仅仅是字符串。Map 的特点是可以快速地添加、删除和查找元素，而且可以保持元素的顺序。下面是一些常用的方法：
创建 Map
我们可以使用 new Map() 来创建一个空的 Map，也可以在创建时传入一个数组，数组的每个元素都是一个键值对的数组，例如：
const map = new Map([ ['name', '张三'], ['age', 18], ['gender', '男'] ]);
添加元素
我们可以使用 set() 方法向 Map 中添加元素，例如：
map.set('address', '北京');删除元素
我们可以使用 delete() 方法删除 Map 中的元素，例如：
map.delete('gender');查找元素
我们可以使用 get() 方法查找 Map 中的元素，例如：
const age = map.get('age');遍历 Map
我们可以使用 for...of 循环遍历 Map 中的元素，例如：
for (const [key, value] of map) {
console.log(`${key}: ${value}`);
}Map 的大小
我们可以使用 size 属性获取 Map 的大小，例如：
const size = map.size;
Set
Set 是一种无序的、不重复的集合，它类似于数组，但它的元素不能重复。Set 的特点是可以快速地添加、删除和查找元素，而且可以保持元素的顺序。下面是一些常用的方法：
创建 Set
我们可以使用 new Set() 来创建一个空的 Set，也可以在创建时传入一个数组，数组的每个元素都是 Set 中的一个元素，例如：
const set = new Set(['张三', '李四', '王五']);
添加元素
我们可以使用 add() 方法向 Set 中添加元素，例如：
set.add('赵六');删除元素
我们可以使用 delete() 方法删除 Set 中的元素，例如：
set.delete('王五');查找元素
我们可以使用 has() 方法查找 Set 中的元素，例如：
const hasLiSi = set.has('李四');遍历 Set
我们可以使用 for...of 循环遍历 Set 中的元素，例如：
for (const item of set) {
console.log(item);
}Set 的大小
我们可以使用 size 属性获取 Set 的大小，例如：
const size = set.size;
示例代码
下面是一个使用 Map 和 Set 的示例代码，它实现了一个简单的计数器，用于统计一段文本中每个单词出现的次数：
function countWords(text) {
const words = text.split(/\s+/);
const counts = new Map();
const uniqueWords = new Set(words);
for (const word of uniqueWords) {
let count = 0;
for (const w of words) {
if (w === word) {
count++;
}
}
counts.set(word, count);
}
return counts;
}
const text = 'the quick brown fox jumps over the lazy dog';
const counts = countWords(text);
for (const [word, count] of counts) {
console.log(`${word}: ${count}`);
}总结
Map 和 Set 是 ES2021 中新增的两个数据类型，它们可以让我们更方便地操作数据，提高代码的可读性和性能。本文介绍了 Map 和 Set 的常用方法和示例代码，希望能对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/658bd9c7eb4cecbf2d12107d