生成器函数

一、生成器函数声明与调用

  生成器(Generator)就是一个特殊的函数,用于异步编程。

  常见的异步操作:文件操作、网络操作(ajax,request)、数据库操作等。

  我们之前对异步编程使用的是纯回调函数。生成器就是对异步编程的一种解决方案。

  1.声明方式

function * gen(){
    console.log("Hello generator");
}

  2.执行方式

let iterator = gen();
//必须调用next()方法才能执行
iterator.next();

  在生成器函数中可以执行yield语句;

  yield关键词函数代码的分隔符,将一个函数代码分成几段,一段段的执行,可以让生成器停止和开始执行。

function * gen(){
    console.log(111);
    yield'一直没有耳朵';//一段
    
    console.log(222);
    yield'一直没有尾巴';//一段
    
    console.log(333);
    yield'真奇怪';//一段
    
    console.log(444);
}//一段

二、生成器函数参数传递

function * gen(arg){
    console.log(arg);
    let one = yield 111;
    console.log(one);
    yield 111;
    yield 222;
    yield 333;
}

let iterator = gen('AAA');
//next方法可以传入实参
console.log(iterator.next());//value:111,done:false
//next传入的实参将作为上一个yield语句的返回结果
console.log(iterator.next('BBB'));

三、生成器函数实例

  异步编程

  1.要求:1s后控制台输出111,2s后输出222,3s后输出333;

//使用定时器操作(回调地狱)
setTiemout(() =>{
    console.log(111);
    setTiemout(() =>{
        console.log(222);
        setTiemout(() =>{
            console.log(333);
        },3000)
    },2000)
},1000)

  使用生成器函数来实现:

//使用生成器函数
function one(){
    setTimeout(()=>{
        console.log(111);
        iterator.next();//让它能够继续走下去
    },1000)
}

function two(){
    setTimeout(()=>{
        console.log(222);
        iterator.next();
    },2000)
}

function three(){
    setTimeout(()=>{
        console.log(333);
        iterator.next();
    },3000)
}

function * gen(){
    yield one();
    yield two();
    yield three();
}

//调用生成器函数
let iterator = gen();
iterator.next();

  2.模拟获取用户数据、订单数据、商品数据;

function getUsers(){
    setTimeout(()=>{
        let data = '用户数据';
        //调用next方法,并将数据传入
        iterator.next(data);
    },1000)
}

function getOrders(){
    setTimeout(()=>{
        let data = '订单数据';
        iterator.next(data);
    },1000)
}

function getGoods(){
    setTimeout(()=>{
        console.log('商品数据');
        iterator.next(data);
    },1000)
}

function * gen(){
    let users = yield getUsers();
    console.log(users);
    let orders = yield getOrders();
    console.log(orders);
    let goods = yield getGoods();
    console.log(goods);
}

//调用生成器函数
let iterator = gen();
iterator.next();

 

posted @ 2022-12-06 22:36  雏栀  阅读(219)  评论(0编辑  收藏  举报