promise妙用(等同步函数里的异步执行完再继续执行)

考虑这样一个场景:

function func1(){
    let temp = new Promise((res, rej) => {
        setTimeout( () => {
            console.log('第三');
        },2000)
    })
}
function func2() {
    console.log("第二")
    func1();
}
function func3(){
    console.log('第一');
    func2();
    console.log('第四');
}
func3();

我们希望按顺序打印第一第二第三第四,但是由于fun1里面有一个异步操作,所以先打印了第四,结果为:

image-20210617153819979

但是要是我们第四这一步一定要等第三步运行完才能产生正常的结果,这种情况下我们应该怎么做呢。可以用promise来解决。(虽然有时候也可以用async+await来实现,但是本文讨论更通用的方法),上代码

let promiseTemp = null;
let promiseResolve = null;
function loginFinish() {
    return promiseTemp;
}

function func1(){
    let temp = new Promise((res, rej) => {
        setTimeout( () => {
            console.log('第三');
            promiseResolve('我执行完了,轮到第四了')
        },2000)
    })
}
function func2() {
    promiseTemp = new Promise(resolve => promiseResolve = resolve); 
    console.log("第二")
    func1();
}
async function func3(){
    console.log('第一');
    func2();
    let a = await loginFinish();
    console.log(a)
    console.log('第四');
}
func3();

首先我们fun3执行到fun2的时候,我们给promiseTemp赋值,并将promiseTempresolve赋值给等promiseResolve,这时候loginFinish可以看成如下样子:

function loginFinish() {
    return new promise(promiseResolve => promiseResolve())
}

fun2调用func1的时候有一个异步操作,那么fun3不会等待异步操作,继续执行,执行到let a = await loginFinish();的时候,await要等里面的promise调用promiseResolve才会继续执行,那么promiseResolve什么时候会执行的,就是func1里的异步操作执行完才会执行,所以就完美的符合我们的预期了

image-20210617153733951

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值