Promise和async/await的两种常用的实际应用场景

Promise和async/await常用的就是用来优化多重异步和异步嵌套，防止回调地狱

现在有两种业务场景

1.需要先获取一个人的信息，在通过这个人的信息来进行另外操作，这两个异步操作需要按照先后顺序依次执行

很简单，贴代码

async function getAllInfo(){
    let info1 = await getinfo1()

    console.log(info1)
    let info2 = await getinfo2(info1)
    console.log(info2)
}


getAllInfo()




function getinfo1(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
             resolve("get info1!!")            
        },1000)    
    })
    
}

function getinfo2(info1){
    console.log('执行了getinfo1后传参getinfo2---',info1);
//模拟耗时请求
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
             resolve("get info2!!!")               
        },1000)    
    })    
}

结果是过一秒钟打印出get info1!!
再过一秒钟打印出get info2!!!
看下图

image.png

2.需要同时获取一个人的多方面信息，而且信息需要多个请求才能获得，但是获取的信息没有依赖关系，可以同时请求

这个时候如果向之前一样一个一个执行，效率就会大打折扣，这个时候就要用到Promise.all()，这个方法允许传入promise数组，他会自动帮你把数组打包成一个promise，只有当所有promise都运行完且都为fulfilled才会视为成功，反之则失败，贴代码

async function getAllInfo(){
    Promise.all([getinfo1(),getinfo2()]).then((value)=>{
        console.log(value)
    }).
}
getAllInfo()
function getinfo1(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
             resolve("get info1!!")            
        },1000)    
    })
    
}
function getinfo2(){
//模拟耗时请求
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
             resolve("get info2!!!")               
        },2000)    
    })    
}

image.png

整个promise的时间是由耗时最长的promise决定的，也就是2s

后续会记录下超时处理