ES6 Promise的用法,async/await异步处理同步化

news2025/1/16 2:53:48

文章目录

  • 一、什么是promise ?
  • 二、await / async ES7的新规范,异步处理同步化


一、什么是promise ?

在这里插入图片描述

promise是解决异步的方法,本质上是一个构造函数,可以用它实例化一个对象。对象身上有resolve、reject、all,原型上有then、catch方法。promise对象有三种状态:pending(初识状态/进行中)、resolved或fulfilled(成功)、rejected(失败)

  1. pending。它的意思是 “待定的,将发生的”,相当于是一个初始状态。创建Promise对象时,且没有调用resolve或者是reject方法,相当于是初始状态。这个初始状态会随着你调用resolve,或者是reject函数而切换到另一种状态。

请添加图片描述

  1. resolved。表示解决了,就是说这个承诺实现了。 要实现从pending到resolved的转变,需要在 创建Promise对象时,在函数体中调用了resolve方法
    请添加图片描述

  2. rejected。拒绝,失败。表示这个承诺没有做到,失败了。要实现从pending到rejected的转换,只需要在创建Promise对象时,调用reject函数。

请添加图片描述

看上面的引用,promise就是用来解决异步的方法,光看上面的解释可能不懂什么意思,但是它后面说的实例化对象后端方法,你肯定用过,如then、catch等,通过以下代码打印一下他里面的方法。

console.dir(Promise)

浏览器打印结果:

请添加图片描述
下面就通过promise实例化,完成对上面回调地狱函数进行重构

//promise链式调用
this.getNav().then(res=>{
  let id=res.data[0].id;
  return this.getArticle(id);
}).then(res=>{
  let id=res.data[0].id;
  return this.getComment(id)
}).then(res=>{
  console.log(res)
})

二、await / async ES7的新规范,异步处理同步化

这两个命令是成对出现的,如果使用await没有在函数中使用async命令,那就会报错,如果直接使用async没有使用await不会报错,只是返回的函数是个promise,可以,但是没有意义,所以这两个一起使用才会发挥出它们本身重要的作用。

async onLoad() {
  let id,res;
  res=await this.getNav();
  id=res.data[0].id;
  res=await this.getArticle(id);
  id=res.data[0].id;
  res=await this.getComment(id);
  console.log(res)
} 

可以看到onload是函数,这个函数必须有async命令,在调用函数的部分,前面都加了一个await,这个命令的意思就是等这一行的异步方法执行成功后,将返回的值赋值给res变量,然后才能再走下一行代码,这就是将原来的异步编程改为了同步编程,这就是标题提到的“异步处理,同步化”,


参考:
咸虾米_https://www.bilibili.com/read/cv18799030

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

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

相关文章

Docker下安装可视化工具Portainer

目录 Portainer简介 Portainer安装 Portainer简介 Portainer是一款开源的容器管理平台,它提供了一个易于使用的Web UI界面,可用于管理和监控容器和集群,旨在使容器管理更加简单和可视化,适用于各种规模的容器环境,从…

解决top-k问题--堆排序

目录 TOP-K问题 堆排序 考虑以下情况: 1.在n个数里面找最大的一个数 2.在n个数里面找最大的两个数 3.在n个数中求前k大的数 为什么不用大根堆呢? 代码 时间复杂度 TOP-K问题 即求数据结合中前K个最大的元素或者最小的元素,一般情况下数…

Sakila数据库和World数据库

Sakila数据库和World数据库 安装MySQL8.2的时候多出两个样例数据库 Sakila数据库和World数据库 Sakila数据库是一个关于DVD租赁的样例数据库,用于展示MySQL的各种功能和特性。Sakila数据库中包含了多个表,包括电影、演员、客户、租赁记录等,可…

美甲美睫店预约会员管理小程序作用如何

美甲美睫是美业中较为重要的类目,主要以小摊、门店/连锁形式,随着线上化程度加深,传统线下美业店面临着困境,想要进一步增长及解决痛点,就需要线上数字化运营得到更多生意。 那么通过【雨科】平台搭建美甲美睫店小程序…

AMBA 5 CHI 协议节点实例和读数据的来源

1. CHI协议节点实例 如上图所示,RN-F、RN-I、HN-F、SN-F、HN-I、SN-I通过内部互联总线连接起来。这里的ICN可以是CMN-700。其中SN-F和SN-I是连接主存,RN-F和HN-F内部都有cache。 2. CHI读数据的可能来源 如上图所示,CHI协议中可能的读数据来…

1949-2021年全国31省公路里程数据

1949-2021年全国31省公路里程数据 1、指标:公路里程 2、范围:包括31省 1978-2021年期间无缺失 3、来源:各省NJ、产业NJ、各省统计GB 4、指标解释:公路里程指报告期末公路的实际长度。 统计范围:包括城间、城乡间、乡…

HDMI之数据岛

概述 发送端在发送视频信号之前,将多媒体信息通过数据岛传输给接收端。接收端通过数据岛信息获取当前分辨率(VIC),编码信息(RGB/YCR等),色彩空间,位深等等。然后对应将视频信息解码。与此同时,多余的带宽用于传输音频信息等。本文通过具体的包信息(从实验室仪器拍照…

[MySQL]日期和时间函数

文章目录 1 获取日期、时间 CURDATE() ,CURRENT_DATE()CURTIME() , CURRENT_TIME()NOW() / SYSDATE() / CURRENT_TIMESTAMP() / LOCALTIME() / LOCALTIMESTAMP()UTC_DATE()UTC_TIME()代码示例2 日期与时间戳的转换 UNIX_TIMESTAMP()UNIX_TIMESTAMP(date)…

使用WPF设计时绑定加快开发速度

知识来源:B站up主 香辣恐龙蛋 第一步 第二步

字符串冲刺题

关卡名 字符串冲刺题 我会了✔️ 内容 1.掌握最长公共前缀问题 ✔️ 2.掌握字符串压缩问题 ✔️ 3.如果想挑战一下就研究:表示数值的字符串 ✔️ 1 最长公共前缀 这是一道经典的字符串问题,LeetCode14 先看题目要求:编写一个函数来查找…

【Vue2】Vue的介绍与Vue的第一个实例

文章目录 前言一、为什么要学习Vue二、什么是Vue1.什么是构建用户界面2.什么是渐进式Vue的两种开发方式: 3.什么是框架 三、创建Vue实例四、插值表达式 {{}}1.作用:利用表达式进行插值,渲染到页面中2.语法3.错误用法 五、响应式特性1.什么是响…

OpenOffice 4.1.14的安装以及与数据库进行连接

起因:因为MS Office的Access只能和自家的数据库连接,感觉不太舒服,因此尝试使用Openoffice组件中的Base进行替换。这里记录一下从安装到进行数据库连接的过程。 1.下载地址 https://www.openoffice.org/download/index.html 我这里是Debian1…

ArcGIS制作某村土地利用现状图

1. 根据坐落单位名称属性选择并提取作图数据 (1) 将“作图线状地物”、“作图图班”和“村庄”图层加入ARCGIS(右键Layers-Add data),选择相应路径下的文件加载即可。 (2) 按属性来提取作图村庄的地类图班、线状地物和村界文件(…

(Python) 特殊变量

整体 内置模块 name 用到的模块 对象 函数

AGNES层次聚类

已知数据集D中有9个数据点,分别是(1,2),(2,3),(2,1), (3,1),(2,4),(3,5),(4,3),(1,5),(4,2)。要求: (1)采用层次聚类的聚集算法进行聚类,k2。 (2)距离计算采用欧几里得距离。 (3)簇之间的距离采用单链接方…

Lag-Llama:基于 LlaMa 的单变量时序预测基础模型

文章构建了一个通用单变量概率时间预测模型 Lag-Llama,在来自Monash Time Series库中的大量时序数据上进行了训练,并表现出良好的零样本预测能力。在介绍Lag-Llama之前,这里简单说明什么是概率时间预测模型。概率预测问题是指基于历史窗口内的…

12月1号作业

实现运算符重载 #include <iostream>using namespace std; class Person{friend const Person operator-(const Person &L,const Person &R);friend bool operator<(const Person &L,const Person &R);friend Person operator-(Person &L,const …

FL Studio 21.2.1.3859中文破解激活版2024免费下载安装图文教程

FL Studio 21.2.1.3859中文破解激活版是我见过更新迭代最快的宿主软件&#xff0c;没有之一。FL Studio12、FL Studio20、FL Studio21等等。有时甚至我刚刚下载好了最新版本&#xff0c;熟悉了新版本一些好用的操作&#xff0c;Fl Studio就又推出了更新的版本&#xff0c;而且F…

【数电笔记】11-最小项(逻辑函数的表示方法及其转换)

目录 说明&#xff1a; 逻辑函数的建立 1. 分析逻辑问题&#xff0c;建立逻辑函数的真值表 2. 根据真值表写出逻辑式 3. 画逻辑图 逻辑函数的表示 1. 逻辑表达式的常见表示形式与转换 2. 逻辑函数的标准表达式 &#xff08;1&#xff09;最小项的定义 &#xff08;2&am…

2023年5月电子学会青少年软件编程 Python编程等级考试一级真题解析(判断题)

2023年5月Python编程等级考试一级真题解析 判断题(共10题,每题2分,共20分) 26、在编写较长的Python程序时,所有代码都不需要缩进,Python会自动识别代码之间的关系 答案:错 考点分析:考查python代码书写格式规范,python编写较长的程序时,需要明确严格的缩进,不然有…