ES6 生成器函数

当一个普通函数被调用时，控制权停留在被调用的函数上，直到它返回。 使用 ES6 中的生成器，调用函数现在可以控制被调用函数的执行。 生成器就像一个常规函数，除了

• 该函数可以随时将控制权交还给调用者。
• 当我们调用生成器时，它不会立即运行。 相反，你会得到一个迭代器。 该函数在我们调用迭代器的 next 方法时运行。

生成器通过在 function 关键字后面加上星号来表示； 否则，它们的语法与常规函数相同。

以下示例说明了相同的情况。

"use strict" 
function* rainbow() { 
   // 星号将其标记为生成器
   yield 'red'; 
   yield 'orange'; 
   yield 'yellow'; 
   yield 'green'; 
   yield 'blue'; 
   yield 'indigo'; 
   yield 'violet'; 
} 
for(let color of rainbow()) { 
   console.log(color); 
} 

生成器支持调用者和被调用函数之间的双向通信。 这是通过使用 yield 关键字来完成的。

考虑以下示例

function* ask() { 
   const name = yield "What is your name?"; 
   const sport = yield "What is your favorite sport?"; 
   return `${name}'s favorite sport is ${sport}`; 
}  
const it = ask(); 
console.log(it.next()); 
console.log(it.next('Ethan'));  
console.log(it.next('Cricket')); 

生成器函数的顺序如下 -

• 生成器以暂停状态启动； 返回迭代器。
• it.next() 产生“What is your name”。 生成器暂停。 这是通过 yield 关键字完成的。
• 调用 it.next(“Ethan”) 将值 Ethan 分配给变量名称并产生“What is your favorite sport?” 生成器再次暂停。
• 调用 it.next(“Cricket”) 将值 Cricket 赋给变量 sport 并执行后续的 return 语句。

因此，上述代码的输出将是

{ 
   value: 'What is your name?', done: false 
} 
{ 
   value: 'What is your favorite sport?', done: false 
} 
{ 
   value: 'Ethan\'s favorite sport is Cricket', done: true 
}

注意 - 生成器函数不能使用箭头函数表示。

关于箭头函数，我们将在下一节中进行介绍。