JavaScript 中的迭代器模式(十八)## 1. 简介迭代器模式（Iterator Pattern）是一种行为型

1. 简介

迭代器模式（Iterator Pattern）是一种行为型设计模式，允许我们以一种顺序访问集合对象中的元素，而无需暴露该对象的底层表示或结构。迭代器模式特别适合处理需要遍历集合的情况，比如数组、链表、树结构等数据结构。

在 JavaScript 中，Iterator 是 ES6 引入的一个原生概念。迭代器模式允许我们定义对象的遍历行为，支持像 for...of 这样的循环。

1.1 模式结构

迭代器模式通常包含以下角色：

迭代器（Iterator）：负责定义遍历行为，包括 next() 方法，用于获取集合中的下一个元素。
可迭代对象（Iterable）：集合对象，实现 Symbol.iterator 方法，返回迭代器实例。
客户端（Client）：使用迭代器来遍历集合对象的代码。

2. 实现迭代器模式

2.1 自定义迭代器

虽然 JavaScript 中已有内置的迭代器（如数组、Map、Set 等），但我们也可以自己实现迭代器，以定义自定义的遍历逻辑。

示例：自定义数列迭代器

我们将创建一个简单的数列迭代器，它能够生成一系列数字。

// 自定义迭代器工厂函数
function createNumberIterator(start = 0, end = 10, step = 1) {
  let current = start;

  return {
    next() {
      if (current < end) {
        const value = current;
        current += step;
        return { value, done: false };
      } else {
        return { value: undefined, done: true };
      }
    }
  };
}

// 使用自定义迭代器
const numberIterator = createNumberIterator(0, 5);

console.log(numberIterator.next()); // { value: 0, done: false }
console.log(numberIterator.next()); // { value: 1, done: false }
console.log(numberIterator.next()); // { value: 2, done: false }
console.log(numberIterator.next()); // { value: 3, done: false }
console.log(numberIterator.next()); // { value: 4, done: false }
console.log(numberIterator.next()); // { value: undefined, done: true }

2.2 可迭代对象（Iterable）

JavaScript 对象可以通过实现 Symbol.iterator 来变成可迭代对象，从而支持像 for...of 这样的迭代语法。我们可以修改上述数列迭代器，来使其变为可迭代对象。

// 可迭代对象
const iterableNumberRange = {
  start: 0,
  end: 5,
  [Symbol.iterator]() {
    let current = this.start;
    const end = this.end;

    return {
      next() {
        if (current < end) {
          return { value: current++, done: false };
        } else {
          return { value: undefined, done: true };
        }
      }
    };
  }
};

// 使用 for...of 迭代
for (const number of iterableNumberRange) {
  console.log(number); // 输出 0, 1, 2, 3, 4
}

2.3 代码解释

createNumberIterator 是一个工厂函数，用于创建一个简单的数列迭代器。该迭代器通过 next() 方法返回当前数值并更新到下一个数值，直到达到结束条件。
iterableNumberRange 是一个实现了 Symbol.iterator 的对象。通过实现这个方法，任何对象都可以通过 for...of 循环进行遍历。

3. 内置迭代器与生成器

除了自定义迭代器，JavaScript 还提供了多种内置的可迭代对象，比如数组、Map 和 Set。此外，ES6 还引入了生成器（Generators），它能够轻松创建迭代器。

3.1 生成器函数

生成器是一种特殊的函数，能够返回一个迭代器对象。生成器函数用 function* 定义，内部通过 yield 来逐步返回值。

示例：生成器实现数列迭代器

// 使用生成器实现数列迭代器
function* numberGenerator(start = 0, end = 5) {
  let current = start;
  while (current < end) {
    yield current++;
  }
}

// 使用生成器
const generator = numberGenerator(0, 5);
for (const number of generator) {
  console.log(number); // 输出 0, 1, 2, 3, 4
}

3.2 生成器的优势

简化迭代器实现：生成器通过 yield 自动实现了迭代器的 next() 方法，避免了手动管理状态。
中断与恢复执行：生成器允许函数执行过程中暂停，并在后续恢复执行，这使得生成器非常适合处理异步任务流或数据流。

4. 实际应用场景

迭代器模式在实际开发中的应用非常广泛，尤其是需要遍历集合或定义遍历顺序的场景。

遍历数据结构：迭代器模式广泛应用于各种数据结构的遍历，比如数组、链表、树、图等。通过迭代器，可以灵活地定义集合元素的访问顺序。
分页加载：迭代器模式可以用于分页数据的加载，当需要逐页加载数据时，迭代器能够控制每次返回的数据量，并逐步获取下一页的数据。
生成无限序列：生成器和迭代器可以轻松实现无限序列的生成，比如斐波那契数列、无限数字序列等。
惰性求值：通过迭代器和生成器，可以实现惰性求值，即只有在需要时才生成数据。惰性求值在处理大数据集或无限序列时非常有用。

5. 迭代器模式的优缺点

优点

支持不同数据结构的遍历：迭代器模式统一了对不同数据结构的访问方式，使得客户端代码能够以相同的方式遍历不同的集合对象。
解耦集合与遍历逻辑：迭代器模式将遍历行为从集合对象中分离出来，使得集合类无需关心如何遍历自身。
支持惰性求值：通过生成器等迭代器机制，能够实现惰性求值，避免一次性处理大量数据。

缺点

开销较高：对于简单的数据结构（如数组），使用迭代器可能会增加不必要的开销。直接遍历数组通常更高效。
复杂性提升：当迭代逻辑较为复杂时，手动实现迭代器可能会增加代码复杂性。

6. 总结

迭代器模式是一种非常有用的设计模式，它为我们提供了统一的方式来访问集合对象的元素。通过使用迭代器，我们可以在不暴露集合内部结构的情况下轻松遍历各种数据结构。

JavaScript 提供了丰富的迭代器支持，包括原生的 Symbol.iterator 和生成器，使得我们可以轻松定义和使用自定义的迭代器。无论是在处理有限集合还是无限序列时，迭代器模式都能帮助我们编写更简洁、高效的代码。