深扒 ES6 两大全新数据结构：Map & Set（费曼学习法）

前端

2023-11-03 15:54:06

大家好，我是 「艾伦」 ，一名刚进入前端领域的职场新人。为了帮助正在努力学习前端的女朋友，我决定用费曼学习法 展开一个全新专栏 。在这个专栏中，我们将一起学习 ES6 中的两大全新数据结构：Map 和 Set。

费曼学习法 是一种非常有效的学习方法，它要求我们用最简单的语言把一个复杂的概念解释清楚。通过这种方式，我们可以更好地理解和掌握这个概念。

Map 和 Set 是 ES6 中新增的两个数据结构，它们的功能非常强大。我们一起来看看它们的特点：

Map

键值对存储 ：Map 可以存储键值对，键可以是任何类型的值，而值可以是任何类型的值。
快速查找 ：Map 可以通过键快速查找值，查找速度非常快。
遍历：Map 可以很容易地遍历，我们可以使用 forEach() 方法来遍历 Map 中的键值对。

Set

存储唯一值 ：Set 可以存储唯一值，即一个值只能出现在 Set 中一次。
快速查找 ：Set 可以通过值快速查找值，查找速度非常快。
遍历：Set 可以很容易地遍历，我们可以使用 forEach() 方法来遍历 Set 中的值。

Map 和 Set 是非常有用的数据结构，它们可以帮助我们更轻松地管理和处理数据。让我们通过一些示例来看看如何使用它们：

// 使用 Map 存储键值对
const map = new Map();
map.set('name', '艾伦');
map.set('age', 25);
map.set('city', '北京');

// 通过键获取值
console.log(map.get('name')); // "艾伦"

// 遍历 Map
map.forEach((value, key) => {
  console.log(`${key}: ${value}`);
});

// 使用 Set 存储唯一值
const set = new Set();
set.add('JavaScript');
set.add('Python');
set.add('Java');

// 通过值查找值
console.log(set.has('JavaScript')); // true

// 遍历 Set
set.forEach((value) => {
  console.log(value);
});