Vue中async和await的使用

article/2025/9/13 21:01:59

 

在使用vue中如果返回的值是一个Promise对象,那我们就可以用async和await简化这段代码

        async是作为一个关键词放在函数的最前面,而await是放在async函数里面的,async表示这个函数是异步的,await是等待的意思,它的后面我们一般都放返回值是一个Promise对象的函数。

使用async函数返回的一定是个Promise对象,而await的作用就是等待这个对象执行完毕,并且接收到返回值的时候才会继续执行下一步,在此之前就像暂停了一样,没有接收到返回值是不会进行下一步的,但是它在等待的时候并没有妨碍async函数外面的代码执行。

如果两个函数都使用async但是不使用await两个函数之间还有调用关系,那输出结果会如何

在输出1,2,3,4的时候我们会发现,顺序变了,虽然最后还是拿到了返回的数据,但是是在全部执行完毕之后才返回数据,这个就能说明问题了,因为我们在还没有拿到数据做校验的时候,页面已经提示成功了。说明左边的函数是不会等右边的异步函数返回结果之后在执行。

如果加上await效果如下

在这个图片中执行顺序正常了,因为在右边的函数中,由于加上了await,当执行到这一步的时候,他不会立即返回,而是会等待这个函数执行完毕返回结果之后才会跳转到左边的函数中继续执行下一步,所以如果使用async函数的话,要记得加上await。

可以的出一个结论,async是一个异步函数,但是await配合async一起使用后,就相当于把异步函数变成了同步,因为await会等待他后面的表达式返回结果之后才执行下一步。

 


http://chatgpt.dhexx.cn/article/2aUijdlu.shtml

相关文章

async与await

1.基本概念:async await号称异步的终极解决方案,async await之后再无回调. 2.基本使用: async用于修饰一个函数, 表示一个函数是异步的. 如果async函数内没有await, 那么async没有意义的, 全是同步的内容. 只有遇到了await开始往下, 才是异步的开始. 我们用代码…

async/await 用法

目录 1、 async 函数1.1、例子:async函数不写返回值1.2、例子:async函数写了返回值,返回值为一般数据1.3、例子:async函数写了返回值,返回值为一个promise对象 2、await 函数2.1、例子:await 右侧表达式是p…

c# async/await的用法

转于:https://www.cnblogs.com/liqingwen/p/5831951.html 关键: 异步方法:在执行完成前立即返回调用方法,在调用方法继续执行的过程中完成任务。 async/await 结构可分成三部分: (1)调用方法&a…

async/await详解

🐱个人主页:不叫猫先生 🙋‍♂️作者简介:专注于前端领域各种技术,热衷分享,期待你的关注。 💫系列专栏:vue3从入门到精通 📝个人签名:不破不立 &#x1f36c…

C# 中的Async 和 Await 的用法详解

1 众所周知C#提供Async和Await关键字来实现异步编程。在本文中,我们将共同探讨并介绍什么是Async 和 Await,以及如何在C#中使用Async 和 Await。 写在前面 自从C# 5.0时代引入async和await关键字后,异步编程就变得流行起来。尤其在现在的.NET…

async、await

词法定义 async async 是“异步”的简写, async 用于申明一个异步的 function await await 可以认为是 async wait 的简写,await 用于等待一个异步方法执行完成。 借检https://www.cnblogs.com/airen123/p/9543490.html 特点: asayc的用…

C# 彻底搞懂async/await

关键: 异步方法:在执行完成前立即返回调用方法,在调用方法继续执行的过程中完成任务。 async/await 结构可分成三部分: (1)调用方法:该方法调用异步方法,然后在异步方法执行其任务的…

async、await总结

一、async用法 async作为一个关键字放到函数前面,用于表示函数是一个异步函数。异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 异步函数语法很简单,就是在函数前面加上async 关键字,来表示它是异步的。 那怎么调用呢?a…

async和await

async和await 概念 先从字面意思来理解。async 是“异步”的简写,而 await 可以认为是 async wait 的简写。所以应该很好理解 async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成。 另外还有一个很有意思的语法规定&#xff0…

被说一知半解,await不懂你别乱用

文章目录 1.前言2.await是否阻塞主线程?3.await是否同步?4.总结 1.前言 这篇文章我是不想写的,因为之前已经写过了(异步回调Async Await与Promise区别),此时此刻的心情是非常的不满,为什么呢&a…

async、await详解

一、async/await是什么? 简而言之, async用于申明一个function是异步的; 而await则可以认为是 async await的简写形式,是等待一个异步方法执行完成的。 二、async和await的基础使用 async/awiat的使用规则: async 表示这是一个a…

理解异步函数async和await的用法

定义 1. async 是异步的意思,await则可以理解为 async wait。所以可以理解async就是用来声明一个异步方法,而 await是用来等待异步方法执行 2. async作为一个关键字放在函数前面,表示该函数是一个异步函数,异步函数意味着该函数的…

(一)概述:NGS测序在病原微生物检测中的应用

❝ NGS 技术在临床上的应用逐步趋于成熟,从早期的肿瘤基因检测,到如今大热的微生物病原核酸检测,NGS 技术以其快速、准确和高分辨率的特点,发挥着无可替代的作用。 ❞ 微生物在地球上无处不在,从陆地到海洋&#xff0c…

肿瘤NGS测序公司生信工程师水平划分

生信工程师能力划分 1、大头兵(1)初级生信工程师工作职责任职要求 (2)中级生信工程师工作职责任职要求 (3)高级生信工程师工作职责任职要求 2、主管/经理职位描述任职要求 3、总监参考资料: 去年…

NGS数据分析实践:04. 准备测序数据

NGS数据分析实践:04. 准备测序数据 文接上篇:NGS数据分析实践:03. 涉及的常用数据格式[5] - vcf格式 本次NGS数据,采用多重PCR靶向扩增子测序技术,在Illunima Hiseq X Ten测序平台上进行双末端(paired-end…

NGS_panel的CAP认证学习笔记

对于基因的定义总体可以划分为两类 GAD: Gene associated with Mendelian disorder; GADs include genes that meet criteria for definitive, strong, or moderate evidence for association with disease as described by ClinGenGUS: Gene of uncertain significance; GUSs …

45万例患者基因检测显示:NGS很难检测出七分之一的致病变异

基于下一代测序(NGS)的临床基因测试越来越多地用于辅助诊断,针对该技术的临床应用有具体的指南,除了检测相对可靠的单核苷酸变异(SNVs)和微小插入缺失(indel),NGS也已经被…

R实战 | NGS数据时间序列分析(maSigPro)

masigpro 跟着Cell学作图 | 6.时间序列分析(Mfuzz包) 一个答疑教程。 maSigPro 流程 示例数据 #BiocManager::install(maSigPro) library(maSigPro) # 载入示例数据 data(data.abiotic) data.abiotic[1:5,1:5] data(edesign.abiotic) head(edesign.abiotic) > data.abiotic…

NGS数据分析实践:03. 涉及的常用数据格式[5] - vcf格式

NGS数据分析实践:03. 涉及的常用数据格式[5] - vcf格式 6. vcf格式6.1 vcf格式整体描述6.2 第8列INFO详解6.3 第9列FORMAT详解6.4 vcf文件简单解读 系列文章: 二代测序方法:DNA测序之靶向重测序 NGS数据分析实践:00. 变异识别的基…

生信小白学习日记Day4Day5——NGS基础 NGS分析注释(BWA软件)

2019年5月30日,晚上,心情变好,好几天没更新了,看到男朋友在学一款软件,我也近朱者赤,来继续注释Day2-2中NGS分析流程中的一个重要软件——BWA NGS基础 NGS分析注释 BWA 对应于NGS分析流程的这两步&…