什么是可迭代对象 (Iterable)？

推荐答案

可迭代对象 (Iterable) 是实现了 [Symbol.iterator] 方法的对象。该方法返回一个迭代器 (Iterator)，用于遍历对象中的元素。常见的可迭代对象包括数组、字符串、Map、Set 等。

本题详细解读

什么是可迭代对象？

可迭代对象是遵循 ECMAScript 2015 (ES6) 中定义的迭代协议的对象。具体来说，可迭代对象必须实现 [Symbol.iterator] 方法，该方法返回一个迭代器对象。迭代器对象必须实现 next() 方法，该方法返回一个包含 value 和 done 两个属性的对象。

可迭代对象的示例

以下是一些常见的可迭代对象示例：

1. 数组：

   const arr = [1, 2, 3];
   const iterator = arr[Symbol.iterator]();
   console.log(iterator.next()); // { value: 1, done: false }
   console.log(iterator.next()); // { value: 2, done: false }
   console.log(iterator.next()); // { value: 3, done: false }
   console.log(iterator.next()); // { value: undefined, done: true }

2. 字符串：

   const str = "hello";
   const iterator = str[Symbol.iterator]();
   console.log(iterator.next()); // { value: 'h', done: false }
   console.log(iterator.next()); // { value: 'e', done: false }
   console.log(iterator.next()); // { value: 'l', done: false }
   console.log(iterator.next()); // { value: 'l', done: false }
   console.log(iterator.next()); // { value: 'o', done: false }
   console.log(iterator.next()); // { value: undefined, done: true }

3. Map：

   const map = new Map([[1, 'one'], [2, 'two']]);
   const iterator = map[Symbol.iterator]();
   console.log(iterator.next()); // { value: [1, 'one'], done: false }
   console.log(iterator.next()); // { value: [2, 'two'], done: false }
   console.log(iterator.next()); // { value: undefined, done: true }

如何自定义可迭代对象？

你可以通过实现 [Symbol.iterator] 方法来创建自定义的可迭代对象。以下是一个简单的示例：

// www.javascriptcn.com code example
const myIterable = {
  [Symbol.iterator]: function* () {
    yield 1;
    yield 2;
    yield 3;
  }
};

for (let value of myIterable) {
  console.log(value); // 依次输出 1, 2, 3
}

可迭代对象的应用场景

可迭代对象在 JavaScript 中有广泛的应用，特别是在以下场景中：

• for...of 循环：用于遍历可迭代对象中的元素。
• 展开运算符 (...)：用于将可迭代对象展开为单个元素。
• 解构赋值：用于从可迭代对象中提取值并赋值给变量。
• Array.from()：用于将可迭代对象转换为数组。

总结

可迭代对象是 JavaScript 中一种重要的数据结构，它允许我们以统一的方式遍历各种集合类型。通过实现 [Symbol.iterator] 方法，任何对象都可以成为可迭代对象，从而支持 for...of 循环等操作。