Vue工程——async/await异步函数的执行顺序

最新推荐文章于 2024-07-04 22:58:41 发布

Is Ying_J!

最新推荐文章于 2024-07-04 22:58:41 发布

阅读量4.4k

点赞数 3

分类专栏： Vue工程

本文链接：https://blog.csdn.net/weixin_47291589/article/details/119277267

版权

本文通过代码示例详细解析Vue项目中async/await异步函数的执行顺序，从同步到异步的步骤层层展开，帮助理解其工作原理。

摘要由CSDN通过智能技术生成

本次讲解思路：先上代码，再介绍执行顺序以及结果

 async function test1(){
      console.log("test1",begin);  //第三步
      const result=await test2();   //第四步
      console.log("result",result);   //第七步
      console.log("test1",end);   //第八步
    }
 async function test2(){
      console.log("test2");   //第五步
 }
 console.log("script begin"); //第一步
 test1(), //第二步
 console.log("script end");   //第六步

首先当遇到异步函数的时候将不会执行，所以异步函数rest1和test2将不会执行，不防可以注释最后三行代码执行试试

第一步：执行 console.log("begin");打印出begin

第二步：执行test1(),

第三步：回到异步函数test1()上，执行异步函数test1,

第四步：执行console.log("test1",begin);打印出test1 begin

第五步：执行const data=await test2();首先是执行test2()，再执行await test2()返回的Promise对象