Generator函数和yield的说明

Generator函数的用途：

Generator函数是ES6引入的，主要是用于异步编程。最大的特点是可以交出函数的执行权（即暂停执行）。

yield只能存在与Generator函数中。

Generator函数返回一个遍历器对象。Generator函数可以通过next方法，去分阶段的注入数据，让函数分阶段的给出不同的返回值。

Generator函数和普通函数的区别：

主要有两个不同。

1. function关键字与函数名之间有一个星号，不同于普通函数，是可以暂停执行的，所以函数名之前要加星号，以示区别。
2. Generator函数体内使用yield语句，可以定义不同的内部状态。

状态：就是数据（内部的状态，就是函数内部的值，它在不同的时候，是不一样的。）

本质上：整个Generator函数就是一个封装的异步任务，或者说是异步任务的容器。

yield命令是异步不同阶段的分界线。

所有，有时也会把yield当成是return。但是，yield与return有本质的不同。

执行Generator函数（next方法）：

next()方法的作用：分阶段的执行Generator函数。

next方法的使用：

1. 无参数
2. 有参数：
   1. 传入的参数：其实就是把上一个yield语句的返回值给覆盖了。
   2. 第一个.next()方法其实就是启动器
      1. 在它之前没有yield语句，所以给第一个.next()方法，是没有意义的。
      2. 给next函数传值不会修改之前的声明的变量的值。

// 定义Generator函数
function* xxfn(){
    var _n = 1;
    var _v = yield _n + 22;
    console.log('aa---:' + _v);
    yield ++_n;
    yield ++_n;
    yield ++_n;
}
var _xxfn = xxfn();
// 第一个 { value: 23, done: false } 
/**
 * 简单的赋值操作语句
 * 还没有到运行到_v赋值的阶段，到第一个yield的时候就停止了
 */
console.log(_xxfn.next());
// 第二个next aa---:abc { value: 2, done: false }
/**
 * 传入的参数把之前上一个yield语句的返回值给覆盖了。
 * 上一个yield语句：_n + 22
 * 传入了 abc ：yield  _n + 22 ===> yield abc ,然后又赋值给了 _v 
 * 然后遇见了下一个yield 就停止了
 */
console.log(_xxfn.next("abc"));
console.log(_xxfn.next());// { value: 2, done: false }

next方法的返回值：

每次调用.next()方法，会返回一个对象。表示当前阶段的信息：

• value属性：
• done属性：（是否执行结束）
  • true：表示函数执行完成
  • false：表示函数执行未完成

// 定义Generator函数
function* xxfn(){
    yield 'a';
    yield 'b';
    yield 'c';
    return 'd';
}
var _xxfn = xxfn();
console.log(_xxfn.next());// { value: 'a', done: false }
console.log(_xxfn.next());// { value: 'b', done: false }
console.log(_xxfn.next());// { value: 'c', done: false }
console.log(_xxfn.next());// { value: 'd', done: true }
console.log(_xxfn.next());// { value: undefined, done: true 

迭代器的引用：

每个迭代器之间是相互独立的，作用域独立。

每当你调用了一个迭代器内部的.next()方法，

Generator函数内部的指针，会从上一次停下来的地方，继续运行，直到遇见下一个yield语句。

// 定义Generator函数
function* xxfn(){
    var _n = 1;
    yield ++_n;
    yield ++_n;
    yield ++_n;
}
var aa = xxfn();
var bb = xxfn();
console.log(aa.next());// { value: 2, done: false }
console.log(aa.next());// { value: 3, done: false }
console.log(bb.next());// { value: 2, done: false }

为什么说是迭代器对象？

要把所有的yield语句都走上一遍。

yield：就像录音机的暂停键。

next：就像录音机的继续键。