JS函数如何定义生成器函数_JS生成器函数定义与使用案例

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

JS函数如何定义生成器函数_JS生成器函数定义与使用案例

2025-11-04

浏览次数：次

返回列表

生成器函数是J*aScript中可暂停和恢复执行的特殊函数，通过function*定义并返回迭代器对象，使用yield逐步返回值，适合处理惰性求值与异步流程。

js函数如何定义生成器函数_js生成器函数定义与使用案例

在J*aScript中，生成器函数是一种特殊类型的函数，它可以在执行过程中暂停和恢复，通过 yield 关键字返回多个值。这种特性使得生成器非常适合处理惰性求值、迭代大量数据或控制异步流程。

什么是生成器函数

生成器函数不会一次性运行完毕，而是可以在执行中途暂停，之后再从中断处继续执行。调用生成器函数时，它并不立即执行函数体，而是返回一个迭代器对象（Iterator），通过调用该对象的 next() 方法来逐步推进函数的执行。

如何定义生成器函数

定义生成器函数有以下几种方式：

1. 使用 function* 语法（最常见）

在函数关键字后加一个星号 *，即可定义一个生成器函数。

function* myGenerator() {
  yield '第一项';
  yield '第二项';
  yield '第三项';
}

2. 作为对象中的方法

在对象字面量或类中，也可以使用简写形式定义生成器方法。

const obj = {
  * generatorMethod() {
    yield 1;
    yield 2;
  }
};

3. 通过 GeneratorFunction 构造器（不常用）

类似于 new Function，可以动态创建生成器函数，但实际开发中很少使用。

生成器函数的基本使用案例

下面通过几个典型例子展示生成器的实际用途。

Net112企业建站系统2.0 build 20120326

Net112企业建站系统，共有：新闻模块，产品模块，案例模块，下载模块，相册模块，招聘模块，自定义模块，友情链接模块八大模块。Net112企业建站系统附带其他辅助工具：内容采集工具，内容批量查找替换工具，静态页面生成工具，文件管理工具。Net112企业建站其他功能：图片水印功能，图片防盗链功能，相册批量上传功能。Net112企业建站系统使用：利用函数调用模块数据。方便、简单、快捷。适用范围：企业

0 查看详情 Net112企业建站系统2.0 build 20120326

案例1：简单值的逐步返回

function* count() {
  yield 1;
  yield 2;
  yield 3;
}
<p>const counter = count();
console.log(counter.next()); // { value: 1, done: false }
console.log(counter.next()); // { value: 2, done: false }
console.log(counter.next()); // { value: 3, done: false }
console.log(counter.next()); // { value: undefined, done: true }

案例2：惰性生成无限序列

利用生成器可以按需生成数据，避免一次性计算所有值。

function* fibonacci() {
  let a = 0, b = 1;
  while (true) {
    yield a;
    [a, b] = [b, a + b];
  }
}
<p>const fib = fibonacci();
console.log(fib.next().value); // 0
console.log(fib.next().value); // 1
console.log(fib.next().value); // 1
console.log(fib.next().value); // 2
console.log(fib.next().value); // 3

案例3：遍历自定义数据结构

为对象添加生成器方法，使其可被 for...of 遍历。

class TaskList {
  constructor() {
    this.tasks = [];
  }
<p>add(task) {
this.tasks.push(task);
}</p><ul><li>[Symbol.iterator]() {
for (let task of this.tasks) {
yield task.toUpperCase();
}
}
}</li></ul><p>const list = new TaskList();
list.add('学习JS');
list.add('练习编码');</p><p>for (let task of list) {
console.log(task);
}
// 输出：
// 学习JS
// 练习编码

yield 和 return 的区别

在生成器中，yield 是暂停并返回值，后续可继续执行；而 return 是结束生成器，并设置 done: true。return 的值也会出现在 value 中。

function* example() {
  yield 'a';
  return 'end';
  yield 'b'; // 不会被执行
}
<p>const it = example();
console.log(it.next()); // { value: 'a', done: false }
console.log(it.next()); // { value: 'end', done: true }

基本上就这些。生成器函数虽然不常直接用于日常业务逻辑，但在实现高级迭代逻辑、状态机或配合 async/await（背后原理就是生成器+Promise）时非常有用。理解其工作机制有助于深入掌握 J*aScript 的异步编程模型。

以上就是JS函数如何定义生成器函数_JS生成器函数定义与使用案例的详细内容，更多请关注其它相关文章！

# 有何 # 河南网站推广营销微信 # 搜索引擎推广营销统计表 # 网站优化排名哪里靠谱 # 成都网站建设素材公司 # 保定京东网站推广电话 # 天门seo优化视频 # 外网推广网站哪个好做点 # 网站建设公众号运营流程 # 潍坊seo优化价格 # 扬州品牌网站建设对象 # 几个 # 返回值 # 高阶 # js函数如何定义 # 遍历 # 迭代 # 数据结构 # 如何实现 # 自定义 # 建站系统 # 区别 # ai # 编码 # js # java # javascript