ES6生成器函数(Generator)

• 概念

生成器函数(Generator)是ES6提供的一种异步编程的解决方案，Generator函数是一个状态机，封装了多个内部状态。

• 语法

执行Generator函数会返回一个遍历器对象，返回的遍历器对象，可以依次遍历Generator函数内部的每一个状态。

形式上，Generator函数是一个普通函数，但是有两个特征。一、function后跟*，function* 函数名；二、函数内部使用yield表达式，定义不同的内部状态。

function* name ([param[,param[,...param]]]) {
    statements
 }
/**
* @name: 函数名
* @param: 参数名，一个函数最多可以有255个参数
* @statements: 普通JS语句
*/

• 描述

生成器函数在执行时能暂停 ，后面又能从暂停处继续执行。调用一个生成器函数并不会马上执行它里面的语句，而是返回一个这个生成器的迭代器对象。当这个迭代器的next()方法被首次调用，其内的语句会执行到第一个出现yield的位置位置，yield后紧跟迭代器

 

返回的值，后续调用依次向下。

/**
 * next()方法返回一个对象，包含两个属性value和done,value标识yield返回值，done属性为布尔
 * 表示生成器后续是否还有yield语句，即生成器函数是否已经执行完毕并返回
 */
 function* gen() {
    yield 10;
    x = yield 'foo';
    yield x;
 }
 var gen_obj = gen(); // 返回生成器的迭代器对象
 console.log(gen_obj.next(), '首次调用next，执行第一个yield为止');
 console.log(gen_obj.next(), '第二次调用，执行第二个yield');
 /**
  * 调用next()方法，如果传入参数，那么这个参数会传给上一条yield语句左边的变量
  */
 console.log(gen_obj.next(100), '第三次调用');
 console.log(gen_obj.next(),'最后一次调用,执行完毕并返回');

next()方法返回一个对象，包含两个属性value和done，value表示yield返回值，done属性为布尔值，表示生成器后续是否还有yield语句，即生成器函数是否已经执行完毕并返回

 

调用next()方法，如果传入参数，那么这个参数会传给上一条yield语句左边的变量

 

 当生成器函数中显示return时，会导致生成器立即变成完成状态，即调用next()方法返回对象的done为true。如果return后面跟了一个值，那么这个值会作为当前调用next()方法返回的value值

• 示例

   /**
    * 生成器接收参数
    */
   function* idMaker () {
     var index = arguments[0] || 0
     while (true) {
      yield index++; 
     }
   }
   var gen1 = idMaker(5);
   console.log(gen1.next().value); // 5
   console.log(gen1.next().value); // 6

如果语句为yield*，则表示将执行权移交给另一个生成器函数（当前生成器暂停执行）

 /**
  * 移交执行权
  * 如果用的是yield*,则表示执行权移交给另一个生成器函数(当前生成器        
     暂停执行)
  * yield* 后需跟生成器函数
  */
  function* anotherGenerator (i) {
    yield i + 1;
    yield i + 2;
    yield i + 3;
  }
  function* generator (i) {
    yield i;
    yield* anotherGenerator(i); // 移交执行权
    yield i + 10;
  }
  var gen2 = generator(10)
  console.log(gen2.next().value); // 10
  console.log(gen2.next().value); // 11
  console.log(gen2.next().value); // 12
  console.log(gen2.next().value); // 13
  console.log(gen2.next().value); // 20
  console.log(gen2.next().value); // undefined