ES6 生成器 生成器应用----异步任务控制

本文介绍了ES6中的生成器,它既是迭代器又是可迭代对象。通过生成器函数创建,使用`yield`关键字来产生迭代数据。在生成器函数中,每次调用`next()`会运行到下一个`yield`。注意,生成器函数可以有返回值,并且可以接收`next()`方法传递的参数。此外,还提到了生成器的`return`方法用于提前结束迭代,以及`throw`方法用于在生成器中抛出错误。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

生成器 (Generator)

  1. 什么是生成器:
    生成器是一个通过构造函数Generator创建的对象,生成器既是一个迭代器,同时又是一个可迭代对象

2.如何创建生成器?
生成器的创建,必须使用生成器函数(Generator Function)

  1. 如何书写一个生成器函数呢?

要将*放到函数关键字后面或者函数名前面


	function *metod() {
	
	}
	function* metod() {
	
	}
	{
		* metod() {
	
		}
	}
	//正是一个生成器函数,该函数一定返回一个生成器

  1. 生成器函数内部是如何执行的?

生成器函数内部是为了给生成器的每次迭代提供的数据

每次调用生成器的next方法,将导致生成器函数运行到下一个yield关键字位置

yield是一个关键字,该关键字只能在生成器函数内部使用,表达“产生”一个迭代数据。

  1. 有哪些需要注意的细节?

1). 生成器函数可以有返回值,返回值出现在第一次done为true时的value属性中
2). 调用生成器的next方法时,可以传递参数,传递的参数会交给yield表达式的返回值
3). 第一次调用next方法时,传参没有任何意义
4). 在生成器函数内部,可以调用其他生成器函数,但是要注意加上*号


	  function* t1(){
            yield "a"
            yield "b"
        }

        function* test() {
            yield* t1();
            yield 1;
            yield 2;
            yield 3;
        }

        const generator = test();

  1. 生成器的其他API
  • return方法:调用该方法,可以提前结束生成器函数,从而提前让整个迭代过程结束
  • throw方法:调用该方法,可以在生成器中产生一个错误

	 function* task() {
            const d = yield 1;
            console.log(d)
            // //d : 1
            const resp = yield fetch("http://101.132.72.36:5100/api/local")
            const result = yield resp.json();
            console.log(result);
        }

        run(task)

        function run(generatorFunc) {
            const generator = generatorFunc();
            let result = generator.next(); //启动任务(开始迭代), 得到迭代数据
            handleResult();
            //对result进行处理
            function handleResult() {
                if (result.done) {
                    return; //迭代完成,不处理
                }
                //迭代没有完成,分为两种情况
                //1. 迭代的数据是一个Promise
                //2. 迭代的数据是其他数据
                if (typeof result.value.then === "function") {
                    //1. 迭代的数据是一个Promise
                    //等待Promise完成后,再进行下一次迭代
                    result.value.then(data => {
                        result = generator.next(data)
                        handleResult();
                    })
                } else {
                    //2. 迭代的数据是其他数据,直接进行下一次迭代
                    result = generator.next(result.value)
                    handleResult();
                }
            }
        }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值