es6之generator详解

generator小试牛刀

• generator 简介

  generator:您可以将生成器视为可以暂停和恢复的进程（代码段),代码在执行的过程中可以主要交出控制权
  genearator 语法:function *是一个新的关键字用于生成器函数（也有生成器方法）。
  yield是generator可以自行暂停的运算符。此外，generator还可以通过yield接收输入和发送输出。

   function* genFunc() {
    // (A)
    console.log('First');
    yield;
    console.log('Second');
   }
    const genObj = genFunc();
    genObj.next();
    // Output: First
    genObj.next();
    // output: Second

1. 当您调用生成器函数genFunc()时，您将获得可用于控制进程的生成器对象genObj
   此时该生成器对象里面的代码还没有执行,该进程最初在行A中暂停。
2. genObj.next()恢复执行，
3. genFunc()中的yield将暂停执行

generator 函数的不同种类

• generator 函数

 function* genFunc() { 
     ··· 
    }
 const genObj = genFunc();

• generator函数表达式

 const genFunc = function* () { 
     ··· 
  };
 const genObj = genFunc();

• 对象中的generator方法

 const obj = {
     * generatorMethod() {
         ···
     }
 };
 const genObj = obj.generatorMethod();

• 类中的generator方法

 class MyClass {
     * generatorMethod() {
         ···
     }
 }
 const myInst = new MyClass();
 const genObj = myInst.generatorMethod();

使用案例

有人问了，这generator有什么用了，generator返回的对象是可迭代的;每个产量都有助于迭代值的序列。

• 使用生成器实现迭代.

function * objectEntries(obj){
   const objKeys=Reflect.ownKeys(obj)
   for(const objKey of objKeys){
       yield [objKey,obj[objKey]]
   }
}

const jane = { first: 'Jane', last: 'Doe' };
for (const [key,value] of objectEntries(jane)) {
    console.log(`${key}: ${value}`);
}

• 解决异步回调
  您可以使用generator极大地简化与Promises的工作。我们来看看一个基于Promise的函数fetchJson（）以及如何通过generator进行改进。