JS generator函数

261 阅读2分钟

generator函数

异步编程

JavaScript

本身是单线程,如果没有异步任务,执行代码的效率非常低

异步编程

前端异步编程的方案:

1.回调函数:将一个函数作为参数传递给另外一个函数,在某个时刻调用这个函数。

2.事件监听

3.发布订阅

4.Promise对象:是一个容器,里面存放的异步代码,获取到异步结果

在Node中获取到文件信息

fs.readFile("/file/readme.md ",function(err,data){
    if (err) throw err
    fs.readFile('/file/reademe2',function(err2,data2){
        //to do
    })
}) 

频繁的使用回调函数来获取异步结果,会出现回调地狱

使用promise的方案解决

new Promise((resolve,reject)=>{
    $.ajax({
        url:"",
        type:"",
        dataType:"json",
        success(res){
            resolve(res)
        }
    })
}).then((msg)=>{
    //继续发送请求
    const Promise=new promise()
    return Promise
}).then((msg)=>{
    //获取到第二次的请求结果
}).catch((err)={
    //失败的时候,执行catch
}).finally(()=>{
    //最后都会执行finally
})

generator编程

基本概念

generator(生成器)ES6里面引入的一种新的概念,新的数据类型。generator可以用来处理异步编程。使用起来编程思想比较难一些,目前异步编程很伤用这种方式。一般使用 await async promise.

语法:

//普通函数
function show(){
    //to do
}
//generator函数 生成器
function* show(){
    
}

function *show(){
     //generator语法
}

generator生成器和普通函数很像,普通函数默认只能返回一个结果

迭代器

当你实例化一个generator生成器后,获取到的结果就是一个迭代器。

let iterator=main()

迭代器里面返回一个next函数,这个函数就是用于流程控制的函数。

next()得到一次结果

例子:

function* main(val){
    console.log("step01",val)
    let x=yield val +1
    console.log("step02",x)
    let y=yeild (x*2)
    console.log("step03",y)
    return x+y
}
let iterator=main(10)
//第一次
const res=iterator.next()//输出10
console.log(res)//{value:11,done:false}
//第二次
const res2=iterator.next(5)//输出5
console.log(res2)//输出{value:10,done:false}
//第三次
const res3=iterator.next(20)//输出20
console.log(res3)//输出{value:25,done:true}

await和async

await和async其实就是generator的语法糖。底层generator+Promise已经封装过了。

yield其实就是await的前身

*就是async的前身

async function show(){
    await xxx
}