ES6 Iterable类型揭秘：了解Array、Set和Map的异同

前端

2023-09-12 22:36:45

深入了解 ES6 中的 Iterable 类型：揭开 Array、Set 和 Map 的奥秘

什么是 Iterable 类型？

在 ES6 中，Iterable 类型是一种可以通过 for-of 循环或展开运算符遍历的数据结构。它提供了遍历数据的一种通用方式，无论其存储在数组、集合还是映射中。

Array：有序和索引

数组是 JavaScript 中最常用的数据结构，可以存储任何类型的值。它们是有序的，可以通过索引值访问每个元素。Array 非常适合存储有序序列或需要随机访问元素的情况。

Set：唯一元素

Set 是 ES6 中引入的一种数据结构，它类似于数组，但只能存储唯一的值。它保证了元素的唯一性，即使添加重复项，也不会改变 Set 中的元素数量。Set 适用于需要存储无序、非重复元素的情况。

Map：键值对

Map 是另一个 ES6 中的新数据结构，它存储键值对。与 Set 一样，Map 也确保了键的唯一性。Map 非常适合存储需要根据键快速检索值的数据，例如对象属性或哈希表。

Array、Set 和 Map 的异同

这三种 Iterable 类型在数据结构和用例上存在一些关键差异：

特性	Array	Set	Map
有序	是	否	否
唯一性	否	是	是
索引	是	否	否
键值对	否	否	是

代码示例

以下代码示例展示了如何使用 Array、Set 和 Map：

// Array
const array = [1, 2, 3, 4, 5];

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

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

// 遍历 Array
for (const element of array) {
  console.log(element);
}

// 遍历 Set
for (const element of set) {
  console.log(element);
}

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