JS 中的 async 与 await

课程地址

有 4 个返回 Promise 对象的函数 ABCD,现在想让这 4 个 Promise 顺序执行:

const isA = true;
const isB = true;
const isC = true;
const isD = true;function A() {return new Promise((resolve, reject) => {console.log("running A");setTimeout(() => {if (isA) {resolve("A success");} else {reject("A fail");}}, 1000);});
}function B() {return new Promise((resolve, reject) => {console.log("running B");setTimeout(() => {if (isB) {resolve("B success");} else {reject("B fail");}}, 1000);});
}function C() {return new Promise((resolve, reject) => {console.log("running C");setTimeout(() => {if (isC) {resolve("C success");} else {reject("C fail");}}, 1000);});
}function D() {return new Promise((resolve, reject) => {console.log("running D");setTimeout(() => {if (isD) {resolve("D success");} else {reject("D fail");}}, 1000);});
}

方法一

前一个 Promise 的 then 返回下一个 Promise 实例,然后链式调用 then

A().then((res) => {console.log(res);return B();}
).then((res) => {console.log(res);return C();}
).then((res) => {console.log(res);return D();}
).then((res) => {console.log(res);}
);

方法二

使用 async 和 await:

async 函数是使用async关键字声明的函数。async 函数是 AsyncFunction 构造函数的实例,并且其中允许使用 await 关键字。async 和 await 关键字让我们可以用一种更简洁的方式写出基于 Promise 的异步行为,而无需刻意地链式调用 promise

await 操作符用于等待一个 Promise 兑现并获取它兑现之后的值。它只能在 async 函数或者模块顶层中使用

await 可以让异步的操作获得同步的写法

async function ABCD() {const resA = await A();		// 同步的写法,但实际上是异步的console.log(resA);const resB = await B();console.log(resB);const resC = await C();console.log(resC);const resD = await D();console.log(resD);
}ABCD();

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/647623.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Docker容器基本管理

目录 一、概述 (一)为什么要用到容器 (二)docker概念 1.镜像 2.容器 3.仓库 (三)Docker与虚拟机的区别 (四)Linux namespace的六大类型 二、安装docker容器引擎 &#xff…

区块链技术在教育领域的应用:Web3教育变革

随着Web3时代的来临,区块链技术在各个领域都展现出了巨大的潜力,而在教育领域,区块链的应用正引领着一场教育变革。本文将深入探讨区块链技术在教育领域的创新应用,以及这一应用如何推动Web3时代的教育变革。 1. 学历和成绩的去中…

成本更低、更可控,云原生可观测新计费模式正式上线

云布道师 在上云开始使用云产品过程中,企业一定遇见过两件“讨厌”事: 难以理解的复杂计费逻辑,时常冒出“这也能收费”的感叹; 某个配置参数调节之后,云产品使用成本不可预估的暴涨。 可观测作为企业 IT 运维必须品…

Pandas数据可视化:折线图、条形图、直方图、箱形图、核密度图、面截图、饼图、散点图、六边形图

plot()方法 plot()方法可以绘制图形,常见参数如下: (1)x:用来设置所绘制图形的x轴数据。 (2)y:用来设置所绘制图形的y轴数据。 (3)kind:用来设置所绘制图形的样式, 默认为:line(折线图)、 bar(垂直条形图)、 barh(横向柱状图,即横向条形图)、 hist(直方…

第13次修改了可删除可持久保存的前端html备忘录:删除按钮靠右,做了一个背景主题:现代深色

第13次修改了可删除可持久保存的前端html备忘录&#xff1a;删除按钮靠右&#xff0c;做了一个背景主题&#xff1a;现代深色 备忘录代码 <!DOCTYPE html> <html lang"zh-CN"> <head><meta charset"UTF-8"><meta name"vi…

Go语言指针变量

1. 指针变量 区别于C/C中的指针&#xff0c;Go语言中的指针不能进行偏移和运算&#xff0c;是安全指针。 Go语言中的指针3个概念&#xff1a;指针地址、指针类型和指针取值。 1.1. Go语言中的指针 Go语言中的函数传参都是值拷贝&#xff0c;当我们想要修改某个变量的时候&a…

Python工具:openpyxl

文档&#xff1a;https://openpyxl.readthedocs.io/en/stable/tutorial.html# 源代码&#xff1a;https://foss.heptapod.net/openpyxl/openpyxl 1.工作簿对象和工作表对象的使用 openpyxl 中有一个 Workbook 类&#xff0c;可以使用 Workbook() 创建工作簿对象&#xff08;该…

【数据结构】72变的双端队列

双端队列 前言一、双端队列1.1 双端队列的定义1.2 输入受限的双端队列1.3 输出受限的双端队列1.5 输入输出都受限的双端队列1.6 小结 二、双端队列的使用2.1 双端队列的出队序列——暴力求解2.1.1 栈的出栈序列2.1.2 输入受限的双端队列2.1.3 输出受限的双端队列2.1.4 输入输出…

2859. 计算 K 置位下标对应元素的和(01-25每日一题)

链接 力扣&#xff08;LeetCode&#xff09;官网 - 全球极客挚爱的技术成长平台 思路 : 直接模拟 代码 class Solution { public:int get(int n){int cnt 0 ;while(n){cnt ;n n & (n-1) ;}return cnt ;}int sumIndicesWithKSetBits(vector<int>& nums, …

three.js中Meshline库的使用

three.js中Meshline的使用 库的地址为什么要使用MeshLine,three.js内置的线不好用吗?MeshLine入门MeshLine的深入思考样条曲线一个问题 库的地址 https://github.com/spite/THREE.MeshLine?tabreadme-ov-file 为什么要使用MeshLine,three.js内置的线不好用吗? 确实不好用,…

金融帝国实验室(Capitalism Lab)V10版本推出新招高管待命选项

金融帝国实验室&#xff08;Capitalism Lab&#xff09;V10版本推出新招高管待命选项 ————————————— 【全新V10版本开发播报】 即将发布的V10版本&#xff0c;在“分配管理器”菜单上将引入一个名为“暂时待命”的新功能。启用此选项后&#xff0c;分配给公司的高…

256:vue+openlayers利用高德逆地理编码,点击地图,弹出某点坐标和地址信息

第256个 点击查看专栏目录 本示例的目的是介绍演示如何在vue+openlayers中利用高德逆地理编码,点击地图,弹出某点坐标和地址信息。这里要仔细阅读高德地图的逆编码API,同时要注意的是,这种转换在中国很好用,到了欧美国家就不好使了。 直接复制下面的 vue+openlayers源代码…

用队列实现实现栈

用队列实现实现栈 力扣&#xff08;LeetCode&#xff09;官网 - 全球极客挚爱的技术成长平台备战技术面试&#xff1f;力扣提供海量技术面试资源&#xff0c;帮助你高效提升编程技能&#xff0c;轻松拿下世界 IT 名企 Dream Offer。https://leetcode.cn/problems/implement-st…

HTML+CSS:炫酷按钮组件

效果演示 实现了一个带有发光效果的按钮。按钮在悬停或激活时会产生发光效果&#xff0c;并且按钮上的文字也会随之移动。 Code <main id"app"><button><span class"text">若冰说CSS</span><span class"shimmer">…

Sentinel-1 扩展时序注释数据集 (ETAD)的查询和下载

概述 Sentinel-1的扩展计时注释数据集&#xff08;ETAD&#xff09;是ESA&#xff08;DLR作为承包商&#xff09;开发的新辅助产品&#xff0c;为用户提供校正&#xff0c;将Sentinel-1 SLC图像的几何精度提高到厘米级别。该产品包含分析就绪层&#xff0c;用于消除大气路径延…

用大模型训练实体机器人,谷歌推出机器人代理模型

谷歌DeepMind的研究人员推出了一款&#xff0c;通过视觉语言模型进行场景理解&#xff0c;并使用大语言模型来发出指令控制实体机器人的模型——AutoRT AutoRT可有效地推理自主权和安全性&#xff0c;并扩大实体机器人学习的数据收集规模。在实验中&#xff0c;AutoRT指导超过…

JVM问题排查手册

三万字长文&#xff1a;JVM内存问题排查Cookbook 一、Heap快照 # jmap命令保存整个Java堆&#xff08;在你dump的时间不是事故发生点的时候尤其推荐&#xff09; jmap -dump:formatb,fileheap.bin <pid> # jmap命令只保存Java堆中的存活对象, 包含live选项&#xff0c;…

mysql备份

1.新建备份目录 mkdir -p /data/mysql_dump/#查找mysql配置位置 find / -name "my.cnf" find / -name "mysql.sock" find / -name "mysqldump"2.定时任务 #每天凌晨备份一次 echo "00 00 * * * root /data/mysql_bak.sh" >> /…

CentOS7服务器的安装配置连接客户端Xshell进行使用

目录 一. CentOS7的安装【在虚拟机中】 二. 查看设置IP地址 三. 安装并连接客户端软件Xshell 3.1 安装Xshell 3.2 xshell连接centos7服务器 四. 切换国内源 一. CentOS7的安装【在虚拟机中】 首先创建一个虚拟机&#xff0c; 这个没什么好说的&#xff0c;基本上都是下…

OSPF协议解析及相关技术探索(C/C++代码实现)

OSPF&#xff08;开放最短路径优先&#xff09;是一种用于自治系统&#xff08;AS&#xff09;内部的路由协议&#xff0c;它是基于链路状态算法的。OSPF的设计目的是为了提供一种可扩展、快速收敛和高效的路由解决方案。 OSPF概念和特点 概念 自治系统&#xff08;AS&#…