【前端】等待异步任务js执行完毕再执行

//页面加载完毕后执行
$(function(){

    console.info('---- 我是js代码 Start ----');

    //异步方法集合
    let promiseArr = [];
    
    //异步方法1
    let p1 = new Promise((resolve, reject) => {
        //当第三方api提供的是异步方法时 这里用setTimeout模拟
        setTimeout(() => {
          console.info('setTimeout1');

          //结束任务
          resolve();
        }, 1000)
    })
    promiseArr.push(p1)



    //异步方法2
    let p2 = new Promise((resolve, reject) => {
        //当第三方api提供的是异步方法时 这里用setTimeout模拟
        setTimeout(() => {
          console.info('setTimeout2');

          //结束任务
          resolve();
        }, 1000)
    })
    promiseArr.push(p2)


    //异步方法3
    let p3 = new Promise((resolve, reject) => {
        //当第三方api提供的是异步方法时 这里用setTimeout模拟
        setTimeout(() => {
          console.info('setTimeout2');

          //结束任务
          resolve();
        }, 1000)
    })
    promiseArr.push(p3)


    
    //等所有promise任务执行完毕后再执行 返回0 1 2 [0,1,2] 
    Promise.all(promiseArr).then(res => {
        //上边异步方法执行完毕之后 会执行这里的方法

        console.info('---- 我是js代码 End ----');
    })
        
    
})

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐