JavaScript async/await 基础使用

news/2025/10/12 17:37:30/文章来源:https://www.cnblogs.com/tianma3798/p/19136880

一、async/awiat的使用规则:

  • async 表示这是一个async函数, await只能用在async函数里面,不能单独使用
  • async 返回的是一个Promise对象,await就是等待这个promise的返回结果后,再继续执行
  • await 等待的是一个Promise对象,后面必须跟一个Promise对象,但是不必写then(),直接就可以得到返回值

 

二、async/await的特点

    • Async作为关键字放在函数前面,普通函数变成了异步函数
    • 异步函数async函数调用,跟普通函数调用方式一样。在一个函数前面加上async,变成 async函数,异步函数,return:1,打印返回值,
    • 返回的是
      promise成功的对象
    • Async函数配合await关键字使用

 

三、asycn/await 使用案例

1.async 函数的返回值,是promise 对象

        //async 函数的返回值 是Promise对象/任务对象let asyncFun=async function (){return 1;}console.info(asyncFun);//不是返回的数字1

2.async 搭载Promise 使用场景

      //使用场景//摇色子方法function dice() {return new Promise((resolve, reject) => {let sino = parseInt(Math.random() * 6 + 1); //生成一个1~6之间的随机小数setTimeout(() => {resolve(sino);}, 2000);});}//异步方法async function text() {let n = await dice();//await 关键字后面调用摇色子方法执行完毕之后,才进行变量赋值console.log("摇出来" + n); //最后打印出摇出来的数
      }text();

 

3. async 搭载 Promise 实现 ajax请求的依次执行

        var numlist = [1, 2,3, 4, 5];//使用Promise解决,执行顺序问题function addString(num) {return new Promise(function (resolve, reject) {$.get('/ajax/addstring', { num }, res => {console.info(res);resolve();});});}async function doAll() {//var temp = await addString(1);//等待异步代码//console.info('--a');//await addString(2);//等待异步代码//console.info('--b');//使用循环任务,依次执行for (var i = 0; i < numlist.length; i++) {var item = numlist[i];await addString(item);}}doAll();

 

 

四、async/await的优点

  1. 方便级联调用:即调用依次发生的场景;
  2. 同步代码编写方式:Promise使用then函数进行链式调用,一直点点点,是一种从左向右的横向写法;async/await从上到下,顺序执行,就像写同步代码一样,更符合代码编写习惯;
  3. 多个参数传递:Promise的then函数只能传递一个参数,虽然可以通过包装成对象来传递多个参数,但是会导致传递冗余信息,频繁的解析又重新组合参数,比较麻烦;async/await没有这个限制,可以当做普通的局部变量来处理,用let或者const定义的块级变量想怎么用就怎么用,想定义几个就定义几个,完全没有限制,也没有冗余工作;

  4. 同步代码和异步代码可以一起编写:使用Promise的时候最好将同步代码和异步代码放在不同的then节点中,这样结构更加清晰;async/await整个书写习惯都是同步的,不需要纠结同步和异步的区别,当然,异步过程需要包装成一个Promise对象放在await关键字后面;
  5. 基于协程:Promise是根据函数式编程的范式,对异步过程进行了一层封装,async/await基于协程的机制,是真正的“保存上下文,控制权切换……控制权恢复,取回上下文”这种机制,是对异步过程更精确的一种描述;
  6. async/await是对Promise的优化:async/await是基于Promise的,是进一步的一种优化,不过在写代码时,Promise本身的API出现得很少,很接近同步代码的写法
 

 

更多:

C# 异步编程Task(三) async、await

JavaScript Promise 对象使用讲解

C# 异步编程Task整理(一)

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

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

相关文章

IoT水利监控系统:从需求到实现的完整技术方案 - 指南

IoT水利监控系统:从需求到实现的完整技术方案 - 指南pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas&qu…

Educational Codeforces Round 101 (Rated for Div. 2) 题解

题面 A. Regular Bracket Sequence 【题面】 给定一个长度为 \(n\) 的序列 \(S\),其中有包括 (,),和 ?。问如果可以把 ? 变成 ( 或者 ),是否可以把序列 \(S\),变成括号序列。 保证存在一个左括号和一个右括号 【…

Centos7下docker的jenkins下载并配置jdk与maven

在CentOS 7环境下,通过Docker部署Jenkins并为其配置Java Development Kit (JDK) 与Apache Maven,是构建持续集成/持续部署(CI/CD)环境的常见步骤。下面是详细的操作指南,旨在帮助您顺利完成这一过程。 步骤1: 安装D…

The 2024 ICPC Asia Shanghai Regional Contest

Preface 马上要 25 年 Regional 了才猛然发现去年的 IC Regional 还有上海和杭州两场没 VP 过,最近找机会补了 这场前期我和祁神在签到题 C 上坐牢一小时,本来以为要崩了,结果中期题做的还都挺顺 最后 4h 的时候过了…

英语_阅读_Fireflies_待读

Imagine you are in a field at night, and suddenly, you see lots of little lights around you. 想象一下,你在一个夜晚的田野中,突然看到周围有许多小小的光点。 You have just found a gathering of fireflies,…

深入解析:RoadCLIP 笔记 针对自动驾驶优化的 CLIP 变体 vlm

深入解析:RoadCLIP 笔记 针对自动驾驶优化的 CLIP 变体 vlmpre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Conso…

ASP.NET Razor VB 变量 - 实践

ASP.NET Razor VB 变量 - 实践pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas", "Monaco"…

深入解析:【Day 66】Linux-Zabbix监控

pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas", "Monaco", "Courier New", …

dos命令和命令提示符

打开命令提示符 方式开始菜单 win键+r 输入cmd打开 在任意文件下面,按住shift键+鼠标右键,选择在此处打开命令行窗口 资源管理器的地址栏前面加上 cmd 路径管理员方式运行 打开菜单找到命令提示符,右键选择以管理员…

27. 移除元素 暴力+快慢指针+相向双指针

27. 移除元素 1、暴力 解题过程 外层循环遍历nums数组,当遇到等于val的元素时,进入内层循环将后续元素均前移一位,覆盖前一个元素。 时间复杂度: O(n^2) 空间复杂度: O(1) class Solution {public int removeElemen…

ST表学习笔记

前置知识:倍增 其实倍增就是二进制拆分,因为有的数可能很大,我们按照2的幂次去查询,就能用 \(log_2n\) 的时间复杂度求解 ST 表 创建 ST 表运用的是倍增思想,我们可以用 \(O(nlogn)\) 的时间创建一个二维表,根据…

谈一类易实现的非四毛子线性 RMQ

考虑设 \(B=64\),每 \(64\) 个元素分一块。 处理跨块查询 这样的查询,是由一段的后缀拼上若干整块拼上一段前缀。 因此我们维护每个块的前后缀最值以及将每一块的最值拿出建立 \(ST\) 表。 复杂度 \(O(n+\frac{n}{B}…

我们学会在具体情境中做出恰当判断

当前AI的"情感"本质是数据驱动的符号运算。虽然能通过分析人类表情、语言模式生成"合理"回应,但缺乏神经递质调节和生物电信号支持5。例如,AI可以模仿安慰人的语言,却不会因共情而失眠,也不会…

【教程】无需第三方应用,Windows自带邮箱如何绑定QQ邮箱等第三方邮箱

无需第三方应用,Windows自带邮箱如何绑定QQ邮箱等第三方邮箱前言 CSDN主页:https://blog.csdn.net/rvdgdsva 博客园主页:https://www.cnblogs.com/hassle微软的 Outlook 按下win键弹出搜索栏,搜索栏输入邮件就会弹…

ubuntu默认桌面解决vnc灰屏

ubuntu默认桌面解决vnc灰屏一、安装vncserver sudo apt-get install tightvncserver 二、创建/关闭端口 # 创建端口 vncserver :1 -geometry 1920x1000 -depth 24# 关闭端口 vncserver -kill :1 三、解决VNC连接后灰…

2025婚纱摄影影楼权威推荐榜:专业团队与创意拍摄打造梦幻婚礼

随着婚庆行业的不断发展,越来越多的新人开始注重婚纱照的质量和创意。选择一家专业的婚纱摄影影楼,不仅能够记录下美好的瞬间,还能为婚礼增添更多浪漫与回忆。为了帮助筛选婚纱照哪家影楼更专业品牌,特此发布权威推…

分布式结构化存储系统-HBase访问方式

分布式结构化存储系统-HBase访问方式 HBase提供了多种访问方式,包括HBase shell,HBase API,数据收集组件(比如Flume,Sqoop等),上层算框架以及Apache Phoenix等,本篇博客将详细介绍这几种方式。 一.HBase Shell…

智能(embodied AI)、机器人视觉 + 交互、边缘 AI

智能(embodied AI)、机器人视觉 + 交互、边缘 AI智能(embodied AI)、机器人视觉 + 交互、边缘 AI 智能(embodied AI)、机器人视觉 + 交互、边缘 AI 智能(embodied AI)、机器人视觉 + 交互、边缘 AI 智能(embo…

【Azure APIM】自建网关(self-host gateway)收集请求的Header和Body内容到日志中的办法

问题描述 使用 Azure API Management(APIM)时,需要记录每个 API 请求的 Header 和 Body,以便进行问题排查和审计,如何配置才能完整捕获这些信息呢?问题解答 在配置API的时候,启用 trace 策略来收集 inbound / …