async_await用法

2023-11-18

  • async作为修饰关键字修饰在函数前,表示该函数是一个异步函数
  • await的使用必须有async关键字
  • await等待的必须是一个promise对象
  • async返回的是一个promise对象
asyn function A(){ return '星星';}
A().then(result=>{console.log(result);})

在这里插入图片描述

没有await的执行

function A(){
    return new Promise((resolve,reject)=>{
        setTimeout(function(){
                   var num = Math.ceil(Math.random()*20); //生成1-10的随机数
                   console.log('随机数生成的值:',num)
                   if(num<=10){
                       resolve(num);
                   }
                   else{
                       reject('数字太于10了即将执行失败回调');
                   }
               }, 2000);
              })
              return p;
}
async function B(){
    console.log('a前');
     A();
    console.log('a后');
    
}
B();

在这里插入图片描述
在这里插入图片描述

加上await的执行

function A(){
    return new Promise((resolve,reject)=>{
        setTimeout(function(){
                   var num = Math.ceil(Math.random()*20); //生成1-10的随机数
                   console.log('随机数生成的值:',num)
                   if(num<=10){
                       resolve(num);
                   }
                   else{
                       reject('数字太于10了即将执行失败回调');
                   }
               }, 2000);
              })
              return p;
}
async function B(){
    console.log('a前');
     await A();
    console.log('a后');
    
}
B();

在这里插入图片描述
在这里插入图片描述
得出结论:异步执行时,遇到await时,会等待promise返回结果,之后再执行下面的代码,(阻塞后面代码)看起来像是同步一样
注意:await不会阻塞async以外的代码。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

async_await用法 的相关文章

  • CSS动画实现的三种方式

    CSS动画 CSS动画就是元素从一种样式过渡到另一种样式的过程 常见的动画效果很多 比如 平移 缩放 旋转等 CSS实现动画的方式有以下几种 transition 实现渐变动画 transform 实现缩放 平移等效果 animation
  • 【面试】面试官:src和href的区别

    1 请求资源类型不同 1 href是Hypertext Reference的缩写 表示超文本引用 用来建立当前元素和文档之问的链接 常用的有 link a 2 在请求 src 资源时会将其指向的资源下载并应用到文档中 常用的有script
  • 前端实习面试总结

    文章目录 HTML CSS 1 如何理解HTML语义化 2 哪些HTML是块级元素 内联元素 行内元素 行内块元素 3 盒模型的宽度和高度如何计算 4 margin纵向重叠的问题 5 margin负值的问题 6 BFC的理解与应用 7 fl
  • 前端实习面试题(自己当笔记用)

    一 CSS 01 Flex布局 display flex 在父元素设置 子元素受弹性盒影响 默认排成一行 如果超出一行 按比例压缩 容器属性 1 flex direction属性 取值 row 默认 row reverse column c
  • 前端面试题汇总(vue+html基础)最新最全

    一 HTML基础部分 1 什么是盒子模型 重要 在网页中 一个元素占有空间的大小由几个部分构成 其中包括元素的内容 content 元素的内边距 padding 元素的边框 border 元素的外边距 margin 四个部分 这四个部分占有
  • 约瑟夫环问题『js实现』

    传说罗马人占领了乔塔帕特 41 个犹太人被围堵在一个山洞里 他们拒绝被俘虏 而决定集体自杀 大家决定了一个自杀方案 41 个人围成一个圈 由第 1 个人开始顺时针报数 每报数为 3 的人立刻自杀 然后再由下一个人重新从 1 开始报数 依旧是
  • CSS---CSS面试题

    目录 1 盒模型 2 offsetHeight clientheight scrollHeight 3 left与offsetLeft 4 对BFC规范的理解 5 解决元素浮动导致的父元素高度塌陷的问题 6 CSS样式的先级 7 隐藏页面元
  • 哔哩哔哩前端笔试(卷1)

    文章目录 哔哩哔哩前端笔试 1 下面哪个网址和示例符合同源策略 2 关于DOMContentLoaded和load事件说法正确的是 3 如何在 div 容器里展示这几个字符 4 以下是哪一组全是块级元素 5 这个div里面最终的字体颜色是什
  • 经典vue面试题:谈一谈computed计算属性和watch监听属性的区别

    computed计算属性和watch监听的区别 computed属性 首先computed计算属性是用于在HTML模板中表达式更加简洁 易维护 特点 computed具有缓存功能 当与computed变量相关的变量值不发生改变时 一直用的是
  • 【React 进阶】props 和 state 的区别详解

    时隔一年半之久再次重新学习 React 好多都还是原来的样子 这次我要重新开启 React 的大门 希望各位小伙伴可以一起讨论学习呦 前言 今天我们开始第一个专题 React 中 关于 props 和 state 当然我们不是对 props
  • 前端面试之---link 引入css文件和@import引入css文件的区别

    css引入方式link与import的区别 1 link属于html标签 而 import是css提供的 只能加载CSS2 加载顺序 link在页面加载时被加载 import在页面加载完之后再加载3 link是html标签 因此没有兼容性
  • 【高频】前端面试算法题,案例+答案,一学就会!

    目录 前言 题目 1 反转字符串 2 判断回文字符串 3 数组去重 4 找出最大值和最小值 5 斐波那契数列 6 查找缺失的数字 7 判断两个字符串是否是字母异位词 8 实现数组扁平化 9 实现字符串压缩 10 判断是否为无序数组中的连续数
  • JS面试题

    1 es6新特性 let和const关键字 箭头函数 多行字符串 解构赋值 Promises let声明变量和const声明常量 变量不能重复声明 都是块级作用域 不存在变量提升 箭头函数 es6提供了简洁的箭头函数语法 可以更简单的定义函
  • 前端面经高频考点

    文章目录 HTML 1 高频1之行内元素 块级元素 行内块元素的区别 2 高频2之script标签中defer和async的区别 3 src和href的区别 4 lable的作用 5 ifram的使用以及有优缺点 6 img的srcset属
  • JS继承

    最近在面试中被问到js的继承 当时回答的不太好 所以今天特别总结一下 我们先来看一个基于原型链的继承例子 父类 function Person 子类 function Student 继承 Student prototype new Per
  • 前端常见难点面试题

    1 跨域 同源策略 同源策略 同源策略是浏览器的一个安全功能 不同源的客户端脚本在没有明确授权的情况下 不能读写对方资源 同源 就是协议 域名和端口号相同 降域 document domain 同源策略认为域和子域属于不同的域 如 chil
  • 前端开发都需要掌握那些技术?

    前端技术多且杂 那么作为前端开发者 我们可以从那些方面进行进阶提升呢 本文从以下几个方面进行了整理归纳 内容如下 一 网页开发 二 小程序 三 移动端 四 桌面端 五 其他技术 一 网页开发 这里指PC端网页开发 要求的技术主要有以下几类
  • 【1.9w字】彻底搞懂HTTP知识的面试题,建议精读收藏

    我很早之前写过一篇关于 HTTP 和 HTTPS 的文章 但对于 HTTPS 介绍还不够详细 只讲了比较基础的部分 所以这次我们再来深入一下 HTTPS 用实战抓包的方式 带大家再来窥探一次 HTTPS 如何理解 URI URI 全称为 U
  • 实现Tab页之间通信的方式

    5 种方式 localstorage webworker web socket cookie postMessage localstorage 先看效果 test3 gif 代码
  • vue面试题

    1 介绍一下vuex vuex是vue js应用的一个状态管理工具 state 用于保存我们应用的状态 2 v show与v if的区别和使用场景 区别 1 v show 只是简单的控制元素的 display 属性 而 v if 才是条件渲

随机推荐

  • java高频面试题含答案(网络)

    java高频面试题含答案 网络 1 http 响应码 301 和 302 代表的是什么 有什么区别 答 301 302 都是HTTP状态的编码 都代表着某个URL发生了转移 区别 301 redirect 301 代表永久性转移 Perma
  • 膜拜,阿里架构师着重推荐的SprinBoot手册—进阶、原理、实战与面试题分析指南

    我们知道 Spring Boot是一个集成性的开源框架 内部整合了很多第三方组件和框架 这些组件和框架应用如此之广泛 以至于大家反而往往对如何更好地使用Spring Boot自身的功能特性并不是很重视 事实上 Spring Boot自身的功
  • [小技巧] git: Your branch and 'origin/master' have diverged

    本文参考 http stackoverflow com questions 19864934 git your branch and origin master have diverged how to throw away local c
  • mac os x excel 单元格换行

    参考 http jingyan baidu com article 0f5fb09911cb366d8334ea07 html Windows 下是 alt 回车 mac os x 下变成 alt ctrl 回车
  • Vue3通透教程【十四】TS其他类型详解(一)

    文章目录 写在前面 对象类型 函数结构类型 数组类型 元组 枚举 类型别名 写在最后 写在前面 专栏介绍 凉哥作为 Vue 的忠实 粉丝输出过大量的 Vue 文章 应粉丝要求开始更新 Vue3 的相关技术文章 Vue 框架目前的地位大家应该
  • 毕业设计 STM32的智能WIFI视频人脸追踪监控系统

    0 前言 这两年开始毕业设计和毕业答辩的要求和难度不断提升 传统的毕设题目缺少创新和亮点 往往达不到毕业答辩的要求 这两年不断有学弟学妹告诉学长自己做的项目系统达不到老师的要求 为了大家能够顺利以及最少的精力通过毕设 学长分享优质毕业设计项
  • 函数内变量的提升(function hoisting)

    1 函数内外有重名的变量时 局部变量会覆盖全局变量 原因是函数域优先于全局域 2 当js执行进入函数时 函数内部声明过的所有变量会被提到最前 但同时对变量的赋值等操作不会被提升 例 var a 123 function test alert
  • 12帧跑步动画分解图_今天给大家分享一个跑步动画教程和注意事项!希望有所帮助!...

    跑步的动画的制作 一 跑步的基本原理 前面介绍了走路的动画的制作 跑步的制作方式和走路的方式是一样的 但是我们怎样来区别这两个动作的不同呢 虽然跑步在日常生活中经常看见 但是我们可能从来没有仔细的分析每一个动作 现在我们再来简单的说一下走路
  • upload labs第二关

    从上往下 首先定义两个变量 其中一个为空 在点击提交按钮后 前提文件路径可以找到 开始看文件类型是否为jpeg png gif格式 is upload false msg null if isset POST submit if file
  • Docker搭建zookeeper

    问题背景 前言 本文参考自 docker compose快速搭建Zookeeper集群 熬到凌晨三点多验证部署成功 网上有很多文章已经无法正确部署了 因为有些东西版本升级了 版本跟不上就会报错 还有一种更加详细更加全面的部署方式 Docke
  • 新人如何快速高效的学习Java?

    如果是新人 不想通过培训班 想学java 那么我可以很认真的告诉你 如果你是因为兴趣学学 那么你怎么学都可以 建议你找一些零基础入门的视频来学习 先看一遍 认识一下Java是个什么东西 如果是想转行学习 靠这个来工作 那么你就要好好的制定一
  • 一台计算机要两个内网,局域网如何在一台电脑上设置两个IP地址

    由于工作原因 有时需要连接两个局域网 除了频繁地更换不同局域网的网线 还要不停地设置不同局域网的IP地址 真是很麻烦 下面是学习啦小编收集整理的局域网如何在一台电脑上设置两个IP地址 希望对大家有帮助 局域网在一台电脑上设置两个IP地址的方
  • STM32F4单片机ADC采样及ARM-DSP库的FFT

    模拟信号经过ADC采样后变成数字信号 数字信号可以进行FFT运算 在频域中更容易分析信号的特征 本文将介绍如何用STM32F4的进行ADC采样 并利用ARMDSP库里的FFT算法对ADC采样值进行快速傅里叶变换 我使用的是STM32F407
  • CUDA编程中内存管理机制

    GPU设备端存储器的主要分类和特点 大小 全局 Global 和纹理 Texture 内存 大小受RAM大小的限制 本地 local 内存 每个线程限制在16KB
  • windows平台中使用vscode远程连接linux进行c++开发配置教程(内容详细适合小白)-2021-3-30

    文章目录 一 简要介绍 二 软件安装步骤 1 linux系统安装 2 vscode安装 3 ssh安装 4 配置Remote SSH 5 安装远程插件 6 简单小测试 三 配置vscode开发环境 1 默认设置 用户设置 远程设置和工作区设
  • Qt 开发环境搭建

    Qt开发环境搭建 Qt下载 Qt安装 Windows平台 离线安装 在线安装 Qt安装目录 VS2019搭建Qt开发环境 安装扩展插件 Qt VS Tools Qt Versions配置 问题 VS2019双击编辑UI时闪退 qt显示中文乱
  • 区块链物品溯源系统

    文章目录 前言 一 区块链有哪些特点 二 区块链能给品牌或者行业带来什么 1 信任度 2 小程序展示 总结 前言 区块链是一个典型的分布式协同系统 多方共同维护一个不断增长的分布式数据记录 这些数据通过密码学技术保护内容和时序 使得任何一方
  • Qt multiple definition of (function)

    前景 做项目代码优化 将原来的代码按简单工厂模式进行重新组合编写 对整个模块的文件夹进行分类 归纳 中途 出现这一问题 问题详述 某一类中的全部函数都有error multiple definition of function name 解
  • Linux 下刷 TWRP

    安装 adb 和 fastboot apt install android tools adb android tools fastboot 下载需要的 TWRP https dl twrp me flo 开机状态下进入 bootloade
  • async_await用法

    async作为修饰关键字修饰在函数前 表示该函数是一个异步函数 await的使用必须有async关键字 await等待的必须是一个promise对象 async返回的是一个promise对象 asyn function A return 星