返回函数*(){…}是什么意思? [重复]

阅读时长 3 分钟读完

返回函数*(){…}是什么意思? [重复]

在前端开发中,我们经常会看到类似下面这样的代码片段:

-- -------------------- ---- -------
--------- ----- -
  ----- --
  ----- --
  ----- --
-

----- --------- - ------

------------------------------ -- -- - ------ -- ----- ----- -
------------------------------ -- -- - ------ -- ----- ----- -
------------------------------ -- -- - ------ -- ----- ----- -
------------------------------ -- -- - ------ ---------- ----- ---- -

上面的 foo 函数是 ES6 新增的生成器函数,使用 function* 声明。生成器函数可以用来定义一个迭代器,通过 yield 关键字可以返回多个值,而不需要一次性返回所有结果。

生成器函数主要有两个特点:

  1. 它的执行结果是一个迭代器对象,可以被迭代。
  2. 执行过程可以被暂停和恢复,也就是说可以在执行过程中“暂停”函数的执行,并在需要时再次“恢复”执行。

生成器函数的语法非常简单,关键字 function 后跟一个星号(*),函数体内部使用 yield 表达式来定义不同的状态。

上面的例子中,我们定义了一个名为 foo 的生成器函数,该函数只有一个 yield 表达式,它的作用是将 1 返回给调用者。当我们调用 foo() 时,生成器函数会返回一个迭代器对象 generator

接下来,我们使用 console.log() 函数输出了 generator.next() 的结果。注意,每次调用 generator.next() 实际上都是在执行 foo 函数的代码,并且每次执行到 yield 表达式之后就会暂停,等待下一次 next() 调用再继续运行。

因此,第一次调用 generator.next() 返回了 { value: 1, done: false },表示当前值为 1,并且还没有执行完毕;第二次调用 generator.next() 返回了 { value: 2, done: false },表示当前值为 2,同样还没有执行完毕;第三次调用 generator.next() 返回了 { value: 3, done: false },表示当前值为 3,仍然没有执行完毕;最后一次调用 generator.next() 返回了 { value: undefined, done: true },表示所有值都已经迭代完毕。

由此可见,生成器函数可以非常方便地实现基于迭代器的算法和数据结构,比如遍历树、搜索路径等等。同时也大大简化了异步编程中的回调地狱问题。

除了上面的例子外,我们还可以使用生成器函数来实现协程、状态机等高级应用。不过,在使用生成器函数时需要注意一些细节,比如在生成器函数中使用 return 或者 throw 关键字会终止迭代器的执行,同时还需要理解生成器函数的执行顺序、异常处理等问题。

总之,掌握生成器函数是前端开发中非常重要的一项技能,可以让我们更加高效地编写高质量的代码。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/13575

纠错
反馈