ES6 Generator函数

1.什么是Generator

Generator函数是一种异步编程解决方案。

执行Genenrator函数会返回一个遍历器对象，依次遍历Generator函数内部的每一个状态。 Generator函数是一个普通函数，有以下两个特征： function关键字与函数名之间有个星号； 函数体内使用yield表达式，定义不同状态； 通过调用next方法，将指针移向下一个状态，直到遇到下一个yield表达式（或return语句）为止。简单理解，Generator函数分段执行，yield表达式是暂停执行的标记，而next恢复执行。

var GN = function* (){
    yield 1;
    yield 2;
    yield 3;
}
GN.next() // {value : 1, done : false}
复制代码

2.和Iterator 接口的关系

任意一个对象的Symbol.iterator方法，是一个遍历器生成函数，调用该函数会返回该对象的一个遍历器对象。 Generator 函数就是遍历器生成函数，因此可以把 Generator 赋值给对象的Symbol.iterator属性，从而使得该对象具有 Iterator 接口。

var obj = {};
obj[Symbol.iterator] = function* () {
  yield 1;
  yield 2;
  yield 3;
};

[...obj] // [1, 2, 3]
复制代码

3.使用场景

// 控制流管理
// 使用前
f1(function(v1){
    f2(function(v2){
        f3(function(v3){
            // ... more and more
        })
    })
})

// 使用Promise 
Promise.resolve(f1)
    .then(f2)
    .then(f3)
    .then(function(v4){
        // ...
    },function (err){
        // ...
    }).done();
    
// 使用Generator
function * f (v1){
    try{
        let v2 = yield f1(v1);
        let v3 = yield f1(v2);
        let v4 = yield f1(v3);
        // ...
    }catch(err){
        // console.log(err)
    }
}

//异步编程的使用
function * f(){
    let submitOrderCallServer = yield CommonCallServer.submitOrder(params);
    console.log(submitOrderCallServer);
}
// 执行该函数
let g = f();
let result = g.next();
// 由于我们项目里CommonCallServer返回的是Promise对象，所以用then
result.value.then(function(data){
    return data.json();
}).then(function(data){
    g.next(data);
})

复制代码