注意

ES6 规定，默认的 Iterator 接口部署在数据结构的Symbol.iterator属性，或者说，一个数据结构只要具有Symbol.iterator属性，就可以认为是“可遍历的”（iterable）。

Symbol.iterator属性本身是一个函数，就是当前数据结构默认的遍历器生成函数。执行这个函数，就会返回一个遍历器。至于属性名Symbol.iterator，它是一个表达式，返回Symbol对象的iterator属性，这是一个预定义好的、类型为 Symbol 的特殊值，所以要放在方括号内。

一、简介

迭代器（Iterator） 是 JavaScript 中的一种机制，用于遍历数据结构（如数组、对象、集合等）。它提供了一种统一的方式来访问集合中的元素，而不需要关心底层数据结构的具体实现。

迭代器的核心是一个 next() 方法，每次调用 next() 都会返回一个包含两个属性的对象：

• value：当前元素的值。
• done：一个布尔值，表示遍历是否结束（true 表示结束，false 表示还有更多元素）。

二、如何封装一个迭代器对象

1、迭代器协议

一个对象要成为迭代器，需要实现 next() 方法，并遵循以下规则：

• next() 方法必须返回一个对象，包含 value 和 done 属性。
• 如果遍历结束，done 应为 true，且 value 可以省略或为 undefined。

示例：

const myIterator = {
  data: [1, 2, 3],
  index: 0,
  next() {
    if (this.index < this.data.length) {
      return { value: this.data[this.index++], done: false };
    } else {
      return { done: true };
    }
  },
};

console.log(myIterator.next()); // { value: 1, done: false }
console.log(myIterator.next()); // { value: 2, done: false }
console.log(myIterator.next()); // { value: 3, done: false }
console.log(myIterator.next()); // { done: true }

2、可迭代对象

一个对象要成为可迭代对象，需要实现 Symbol.iterator 方法。该方法返回一个迭代器。

示例：

const myIterable = {
  data: [10, 20, 30],
  [Symbol.iterator]() {
    let index = 0;
    return {
      next: () => {
        if (index < this.data.length) {
          return { value: this.data[index++], done: false };
        } else {
          return { done: true };
        }
      },
    };
  },
};

for (const value of myIterable) {
  console.log(value); // 输出: 10, 20, 30
}

三、内置可迭代对象

JavaScript 中的许多数据结构默认是可迭代的，例如：

• 数组（Array）
• 字符串（String）
• Map
• Set
• 函数的 arguments 对象

示例：使用 for...of 遍历数组

const arr = [1, 2, 3];
for (const value of arr) {
  console.log(value); // 输出: 1, 2, 3
}

示例：手动调用迭代器

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()); // { done: true }

四、生成器函数

生成器函数（function*）是创建迭代器的简便方式。使用 yield 关键字可以暂停函数执行并返回一个值。

示例：生成器函数

function* myGenerator() {
  yield 1;
  yield 2;
  yield 3;
}

const iterator = myGenerator();
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()); // { done: true }

五、应用场景

• 遍历数据结构：如数组、Map、Set 等。
• 惰性计算：生成器函数可以按需生成值，节省内存。
• 自定义遍历逻辑：为自定义数据结构实现迭代器。

六、总结

• 迭代器是一个对象，实现了 next() 方法。
• 可迭代对象实现了 Symbol.iterator 方法，返回一个迭代器。
• 生成器函数是创建迭代器的简便方式。
• JavaScript 中的许多内置数据结构（如数组、字符串）都是可迭代的。

通过迭代器，JavaScript 提供了一种统一的遍历机制，使得我们可以更方便地处理各种数据结构。

更新日志

2025/8/24 08:17

查看所有更新日志

• e7112-1于 2025/8/24