10-ES6之Generator 函数

ES6 新引入了 Generator 函数,可以通过 yield 关键字,把函数的执行流挂起,为改变执行流程提供了可能,从而为异步编程提供解决方案。 基本用法

Generator 函数组成

Generator 有两个区分于普通函数的部分:

  • 一是在 function 后面,函数名之前有个 * ;

  • 函数内部有 yield 表达式。

其中 * 用来表示函数为 Generator 函数,yield 用来定义函数内部的状态。

执行机制

调用 Generator 函数和调用普通函数一样,在函数名后面加上()即可,但是 Generator 函数不会像普通函数一样立即执行,

而是返回一个指向内部状态对象的指针,所以要调用遍历器对象Iterator 的 next 方法,指针就会从函数头部或者上一次停下来的地方开始执行。

函数返回的遍历器对象的方法

next 方法

一般情况下,next 方法不传入参数的时候,yield 表达式的返回值是 undefined 。当 next 传入参数的时候,该参数会作为上一步yield的返回值。

遍历器对象抛出了两个错误,第一个被 Generator 函数内部捕获,第二个因为函数体内部的catch 函数已经执行过了,不会再捕获这个错误,所以这个错误就抛出 Generator 函数体,被函数体外的 catch 捕获。

yield* 表达式

yield* 表达式表示 yield 返回一个遍历器对象,用于在 Generator 函数内部,调用另一个 Generator 函数。

 <script>
        //generator函数,可以通过yield关键字,将函数挂起,为了改变执行流,提供了方法,提供异步执行
        //它和普通函数的区别
        //1.function后面,函数名之前有个*
        //2.只能在函数内部使用yeild表达式,让函数挂起

        function* func(a){
            yield 2;
            yield 3;
        }
        let fn=func();
        console.log(fn.next())
        console.log(fn.next())
        console.log(fn.next())
        //{value: 2, done: false}
        //{value: 3, done: false}
        //{value: undefined, done: true}

        //总结:generator函数是分段执行的,yeild语句是暂停自毁长城 ,而next()恢复执行

        //传值
        function * add(){
            console.log("one");
            //x可真的不是yeild‘2’的返回值,他是next()调用,恢复当前yeild返回值
            let x =yield '2';
            console.log("one:"+x);
            let y = yield '3';
            console.log("two"+y);
            return x+y;
        }

        const fn2 =add()
        //函数执行
        console.log(fn2.next());//{value: "2", done: false}
        //第一次yeild被唤醒
        console.log(fn2.next(10));//{value: "3", done: false}
        //第二次yeild被唤醒
        console.log(fn2.next(20));//{value: 30, done: true}


        
    </script>

  

原文地址:https://www.cnblogs.com/lixiang1013/p/13657772.html