Generator

1.Generator函数是ES6提供的一种异步编程解决方案，语法行为与传统函数完全不同。

Generator函数有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield语句，定义不同的内部状态。

{
    // Generator函数    * , yield
    let tell = function* (){
        yield 'a';
        yield 'b';
        return 'c';
    };
    let say = tell();
    console.log(say.next());   //输出结果与iterator类似，实际上是实现了Symbol.iterator接口
    console.log(say.next());
    console.log(say.next());
    console.log(say.next());
}

2，使用Generator实现对象遍历

{
    let obj = {};
    obj[Symbol.iterator] = function* (){
        yield 1;
        yield 2;
        yield 3;
    }
    for(var value of obj){
        console.log("value",value)
    }
}

3，状态机实现循环

{
    let state= function* (){
        while(1){
            yield 'a';
            yield 'b';
            yield 'c';
        }
    }
    let status = state();
    console.log(status.next())  //"a"
    console.log(status.next())  //"b"
    console.log(status.next())  //"c"
    console.log(status.next())  //"a"
    console.log(status.next())  //"b"
}

4.例子：a.实现抽奖环节

    

{
    // 实例实现抽奖环节
    let draw =function(count){
        // 具体抽奖逻辑
        console.info('剩余抽奖次数：',count)
    }
    //次数限制
    let rest= function* (count){
        while(count>0){
            count--;
            yield draw(count);
        }
    }
    let start = rest(5); //次数由服务器端传给前端

    let btn = document.createElement("button");
    btn.id="startButton";
    btn.textContent="抽奖";
    document.body.appendChild(btn);
    document.getElementById("startButton").addEventListener('click',function(){
        start.next();
    },false);

}

b.定时获取服务器端数据

{
    // 定时取服务器端的数据   1.websocket(浏览器兼容性不好) 2.长轮询
    // 长轮询
    let ajax = function* (){
        yield new Promise(function(resolve,reject){
            setTimeout(()=>{           //模拟服务器返回值和响应时间
                resolve({code:0})
            },1000)
        });
    }
    let pull = function(){
        let generator = ajax();
        let step = generator.next();  //返回值是promise对象，可以调用then方法进行回调
        step.value.then(function(d){
            if(d.code != 0){
                console.info("await")
                pull();
            }else{
                console.info(d)
            }
        })
    }
    pull()
}