ES6 Generator生成器和应用

generator函数，可以通过yield关键字，将函数挂起，为了改变执行流，提供了可能性，同时为异步编程提供了方案
于普通函数的区别：
1.function后面 函数名之前有个*
2.它只能在函数内部使用yield表达式，让表达式挂起

对生成器的结构截图：
生成器内部有next()方法

    function* add(){
        console.log("one");
        yield 2;
        console.log("two");
        yield 3;
        console.log("three");
    }
    
    let fn = add();//函数的调用不会进入程序中，该调用只是返回了一个遍历器对象
    console.log(fn);
    console.log(fn.next());//结果 one   {value: 2, done: false}
    console.log(fn.next());//结果 two   {value: 3, done: false}
    console.log(fn.next());//结果 three   {value: undefined, done: false}

    function* add(){
        console.log("one");
        //x 不是yield 2的返回值，它是next()调用，恢复当前yield执行传入的实参
        let x = yield 2;
        console.log("two:"+x);
        let y = yield 3;
        console.log("three:"+y);
        return x + y;
    }
    
    let fn = add();//
    console.log(fn);
    console.log(fn.next());//结果 one   {value: 2, done: false}
    console.log(fn.next(10));//结果 two:10   {value: 3, done: false}
    console.log(fn.next(20));//结果 three:20   {value: 50, done: true}

使用场景：1.为不具备Iterator接口的对象提供了遍历操作

    let obj = {
        name:'张三',
        age:20
    }
    obj[Symbol.iterator] = itrForobj;
    function* itrForobj(obj){
        let propertyKeys = Object.keys(obj);
        for(let propertyKey of propertyKeys){
            yield [propertyKey,obj[propertyKey]];
        }
    }
    
    for(let [key,value] of itrForobj(obj)){
        console.log(`${key},${value}`);
    }

2.生成器对异步编程提供了较大的便利，可以使程序 异步编程同步化

function loadingUI(){
    console.log('loadingUI');
}

function getData(){
    setTimeout(()=>{
        console.log("数据加载完成");
    },1000);
}

function hideUI(){
    console.log('hideUI');
}
loadingUI();
getData();
hideUI();
//显示结果
//loadingUI
//hideUI
//数据加载完成

修改后的程序：

    function* loading(){
        loadingUI();
        yield getData();
        hideUI();
    
    }
    
    let it = loading();
    it.next();
    function loadingUI(){
        console.log('loadingUI');
    }
    
    function getData(){
        setTimeout(()=>{
            console.log("数据加载完成");
            it.next();
        },1000);
    }
    
    function hideUI(){
        console.log('hideUI');
    }
//显示结果
//loadingUI
//数据加载完成
//hideUI