Iterator：迭代器。是一个包含next方法的对象, 并且next方法返回结果是：{ value: any, done: boolean}。只要包含迭代器，就可以使用 for of来遍历。

Iterable：可迭代。如果一个对象实现了Iterator，就被称为可迭代对象。

generator function

generator funciton: 生成器函数，也叫星函数，它与普通函数的区别就是它可以返回多个结果。生成器函数实际上是一种生成迭代器的函数。因此该函数返回的对象是可迭代的。

普通的函数调用一次，只能传一次参数，得到一个结果，一次性执行到底。而行星函数可以像切香肠那样，把函数的执行过程切成不同的段，控制其执行步骤，而且每段执行前可以传参，执行完可以得到结果，是的控制函数更加灵活。

分割代码的原理

http://facebook.github.io/regenerator/

context：用于与改造后的函数通信
wrap后的方法会返回一个遍历遍历器，模拟generator funtion的返回，

yield 是作为表达式存在的(YieldExpression), 一个表达式语句是无意义的，因此YieldExpression会出现在语句当中，这就有2种情况：
其一：YieldExpression.argument = null ; 如：

  1. function* logGenerator() {
  2.   console.log(0);
  3.   console.log(1, yield);
  4.   console.log(2, yield);
  5.   console.log(3, yield);
  6. }

其二：YieldExpression.argument != null；如：

  1. function* yieldAndReturn() {
  2.   yield "Y";
  3.   return "R";
  4.   yield "unreachable";
  5. }


async await

async await: 解决异步调用的终极方案。

async 定义一个协程，await用于挂起阻塞的异步接口。协程遇到await,事件循环会挂起该协程，执行别的协程，直到其他协程也挂起或者执行完毕，再进行下一个协程的执行。

它就是 Generator 函数的语法糖, 可以说是内置执行器的星函数。实现原理如下：
同步版：

  1. async function fn(args) {
  2.   // ...
  3. }
  5. // 等同于
  7. function fn(args) {
  8.   return spawn(function* () {
  9.     // ...
  10.   });
  11. }
  13. function spawn(genF) {
  14.   return new Promise(function(resolve, reject) {
  15.     var gen = genF();
  16.     function step(nextF) {
  17.       try {
  18.         var next = nextF();
  19.       } catch(e) {
  20.         return reject(e);
  21.       }
  22.       if(next.done) {
  23.         return resolve(next.value);
  24.       }
  25.       Promise.resolve(next.value).then(function(v) {
  26.         step(function() { return gen.next(v); });
  27.       }, function(e) {
  28.         step(function() { return gen.throw(e); });
  29.       });
  30.     }
  31.     step(function() { return gen.next(undefined); });
  32.   });
  33. }

异步版：出自

  1. /**
  2.  * async的执行原理
  3.  * 其实就是自动执行generator函数
  4.  * 暂时不考虑genertor的编译步骤（更复杂）
  5.  */
  7. const getData = () =>
  8.   new Promise(resolve => setTimeout(() => resolve("data"), 1000))
  10. // 这样的一个async函数 应该再1秒后打印data
  11. async function test() {
  12.   const data = await getData()
  14.   console.log(data)
  15.   return data
  16. }
  18. // async函数会被编译成generator函数 (babel会编译成更本质的形态，这里我们直接用generator)
  19. function* testG() {
  20.   // await被编译成了yield
  21.   const data = yield getData()
  22.   console.log('data: ', data);
  23.   const data2 = yield getData()
  24.   console.log('data2: ', data2);
  25.   return data + '123'
  26. }
  28. function asyncToGenerator(generatorFunc) {
  29.   return function() {
  30.     const gen = generatorFunc.apply(this, arguments)
  32.     return new Promise((resolve, reject) => {
  33.       function step(key, arg) {
  34.         let generatorResult
  35.         try {
  36.           generatorResult = gen[key](arg)
  37.         } catch (error) {
  38.           return reject(error)
  39.         }
  41.         const { value, done } = generatorResult
  43.         if (done) {
  44.           return resolve(value)
  45.         } else {
  46.           return Promise.resolve(value).then(
  47.             function onResolve(val) {
  48.               step("next", val)
  49.             },
  50.             function onReject(err) {
  51.               step("throw", err)
  52.             },
  53.           )
  54.         }
  55.       }
  56.       step("next")
  57.     })
  58.   }
  59. }
  61. const testGAsync = asyncToGenerator(testG)
  62. testGAsync().then(result => {
  63.   console.log(result)
  64. })

参考

Async iterator 和 generator - The Modern JavaScript Tutorial
https://es6.ruanyifeng.com/