前端 JS 经典:生成器

在 JavaScript 中,**生成器(Generator)**是一种特殊的函数,它可以用来控制迭代器(iterator)的执行,能够暂停和恢复代码的执行。

生成器函数的形式是在普通函数名称之前加一个 *,其主要特征包括:

| function 关键字与函数名之间有一个星号;

| 函数体内部使用关键字 yield 表达式来定义不同的内部状态。

| 生成器函数的使用与普通函数类似,但是调用生成器函数会产生一个迭代器。通过调用迭代器的 next 方法,可以让函数开始或恢复执行。

| yield 关键字可以使生成器函数在执行过程中暂停。在遇到 yield 关键字之前,函数会正常执行,遇到时执行会暂停,函数的作用域状态会被保留下来,直到再次调用 next 方法恢复执行。yield 关键字有点像是函数的中间返回语句,它生成的值会出现在 next 方法返回的对象里。

例如:

javascript 复制代码
function* genFunc() {

  yield "generator";

  yield "hello";

  yield "word";

  return "!";

}



const it = genFunc();

console.log(it.next()); // { done: false, value: 'generator' }

console.log(it.next()); // { donw: false, value: 'hello' }

console.log(it.next()); // { done: false, value: 'word' }

console.log(it.next()); // { done: false, value: '!' }

console.log(it.next()); // { done: true, value: undefined }

执行上述代码,其结果就是迭代器产生的内容。

生成器函数还支持 yield* 表达式,它用于委托(yield delegation),可以将一个生成器的执行委托给另一个生成器,或者用于实现递归操作等。

生成器的特点使得它在处理一些需要逐步生成或处理值的场景中非常有用,例如处理大型数据集、实现异步操作等。它可以让程序在需要的时候才产生下一个值,而不是一次性生成所有的值,从而提高性能和灵活性。

相关推荐
蓝天白云下遛狗21 分钟前
goole chrome变更默认搜索引擎为百度
前端·chrome
come1123444 分钟前
Vue 响应式数据传递:ref、reactive 与 Provide/Inject 完全指南
前端·javascript·vue.js
前端风云志1 小时前
TypeScript结构化类型初探
javascript
musk12121 小时前
electron 打包太大 试试 tauri , tauri 安装打包demo
前端·electron·tauri
翻滚吧键盘2 小时前
js代码09
开发语言·javascript·ecmascript
万少2 小时前
第五款 HarmonyOS 上架作品 奇趣故事匣 来了
前端·harmonyos·客户端
OpenGL2 小时前
Android targetSdkVersion升级至35(Android15)相关问题
前端
rzl023 小时前
java web5(黑马)
java·开发语言·前端
Amy.Wang3 小时前
前端如何实现电子签名
前端·javascript·html5
海天胜景3 小时前
vue3 el-table 行筛选 设置为单选
javascript·vue.js·elementui