JavaScript迭代器模式_Generator函数-js教程-PHP中文网

JavaScript迭代器模式_Generator函数

狼影

发布： 2025-11-24 20:00:07

原创

415人浏览过

Generator函数是ES6中用于实现迭代器模式的特性，通过function*定义并返回可迭代对象，使用yield暂停执行，逐次返回值，适合处理大数据流、无限序列等场景。

javascript迭代器模式_generator函数

迭代器模式在JavaScript中是一种设计模式，用于顺序访问集合中的每一个元素，而无需暴露其底层结构。ES6引入的Generator函数为实现迭代器提供了原生支持，让创建自定义迭代器变得简单直观。

什么是Generator函数

Generator函数是ES6提供的一种异步编程解决方案，语法上比Promise更简洁。它最大的特点是能暂停执行和恢复执行，通过yield关键字控制函数的执行流程。

定义一个Generator函数只需在function关键字后加一个星号（*），调用后返回一个迭代器对象。

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

const gen = myGenerator();
console.log(gen.next()); // { value: 1, done: false }
console.log(gen.next()); // { value: 2, done: false }
console.log(gen.next()); // { value: 3, done: false }
console.log(gen.next()); // { value: undefined, done: true }

Generator实现迭代器模式

由于Generator函数默认返回一个符合可迭代协议的对象，因此非常适合用来实现迭代器模式。

立即学习“Java免费学习笔记（深入）”；

Cutout.Pro抠图

AI批量抠图去背景

查看详情

函数内部使用yield返回每个值
每次调用next()方法会执行到下一个yield语句
可以轻松遍历数组、树结构或自定义数据集合

例如，对一个数组封装成可迭代对象：

function* createIterator(arr) {
  for (let item of arr) {
    yield item;
  }
}

const iterator = createIterator(['a', 'b', 'c']);
console.log(iterator.next()); // { value: 'a', done: false }
console.log(iterator.next()); // { value: 'b', done: false }

实际应用场景

Generator结合迭代器模式可用于处理大数据流、无限序列或异步任务队列。

惰性求值：只在需要时计算下一个值，节省内存
无限序列生成：如斐波那契数列
异步流程控制：配合co库或async/await前身使用

function* fibonacci() {
  let a = 0, b = 1;
  while (true) {
    yield a;
    [a, b] = [b, a + b];
  }
}

const fib = fibonacci();
console.log(fib.next().value); // 0
console.log(fib.next().value); // 1
console.log(fib.next().value); // 1

基本上就这些。Generator函数天然契合迭代器模式，写法清晰，逻辑分离，适合需要逐步处理数据的场景。虽然现在async/await更流行，但在某些复杂控制流中，Generator仍有独特优势。

以上就是JavaScript迭代器模式_Generator函数的详细内容，更多请关注php中文网其它相关文章！