Promise其实也不难

 难点图解:then()方法

a01d447934ca4ffda2be39503b3a53ed.png

ES6学习网站:ES6 入门教程

解决:回调地狱(回调函数中嵌套回调)

两个特点:

(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。

(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

创建 Promise

你可以使用 new Promise() 构造函数来创建一个 Promise。它接受一个带有 resolvereject 两个参数的函数,这个函数会在异步操作完成(成功或失败)时被调用。

let myPromise = new Promise((resolve, reject) => {
  // 异步操作
  setTimeout(() => {
    let success = true;
    if (success) {
      resolve("操作成功!"); // 成功时调用 resolve,状态fulfill且改变当前promise对象的结果
    } else {
      reject("操作失败!"); // 失败时调用 reject
    }
  }, 2000); // 模拟2秒延迟
});

  Promise原型的方法

then()

p.then(value)=>{console.log('value')},成功调用时执行,resolve()类似声明,将形参传给then()方法

在then()方法的参数函数中,通过形参使用promise对象的结果

如果promise的状态不改变,then()里的方法不会执行

使用return会将当前promise实例的状态改成fulfilled,return返回值将作为形参传给下一个then()

如果当前then()中代码出错,会将promise实例的状态改成rejected
53b4f135c03e44deb2c486e89051026d.png

3ed262dd936c49878cb587cb1ea2499a.png

catch()

catch(),失败调用时执行

何时触发?reject()或者Promise执行体中有错

处理 Promise

使用 then() 方法来处理 Promise 对象的成功完成情况,并使用 catch() 方法来处理失败情况。

myPromise.then((message) => {
  console.log("成功:", message); // Promise 被 resolve 时执行
}).catch((error) => {
  console.error("错误:", error); // Promise 被 reject 时执行
});

 上边说到Promise是一个构造函数,new之后等于说调用了构造函数,构造函数中传的参数是一个函数,这个函数内的两个参数分别又是两个函数(reslovereject)

Promise 链 

Promise 可以通过链式调用进一步简化处理多个异步操作的代码。在 then() 方法中返回一个新的 Promise对象状态为pending,可以使得链式调用变得更加清晰。

// 假设有一个函数 fetchUserData 返回一个 Promise,用于获取用户数据
fetchUserData()
  .then((userData) => {
    // 处理获取到的用户数据
    return fetchUserPosts(userData.userId); // 返回另一个 Promise
  })
  .then((userPosts) => {
    // 处理获取到的用户发帖数据
  })
  .catch((error) => {
    console.error("处理过程中出现错误:", error);
  });

 Promise.all 

Promise.all() 用于同时处理多个 Promise,并在所有 Promise 都成功时返回一个包含所有结果的 Promise,但只要有一个 Promise 失败,它就会立即返回失败

let promise1 = someAsyncOperation();
let promise2 = anotherAsyncOperation();

Promise.all([promise1, promise2])
  .then((results) => {
    // results 包含了两个 Promise 的结果
  })
  .catch((error) => {
    // 处理失败情况
  });

Promise.race

 Promise.race() 用于竞争多个 Promise,返回一个新的 Promise,其结果由最先完成的 Promise 决定

let promise1 = fetchUserData();
let promise2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject("操作超时!");
  }, 500); // 模拟超时操作
});

Promise.race([promise1, promise2])
  .then((result) => {
    // 处理最先完成的 Promise 的结果
  })
  .catch((error) => {
    // 处理失败情况,可能是超时或其他原因
  });

 

 

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

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

相关文章

AvP:水平基因转移HGT检测

帮其他人做的一个尝试,本身不太了解这一块,要是做错了请多多包涵 Home GDKO/AvP Wiki GitHub 安装AvP 数据库准备 git clone https://github.com/GDKO/AvP.git conda create --name avp conda activate avp conda install -y -c bioconda mafft bl…

鸿蒙Harmony应用开发—ArkTS声明式开发(基础手势:PluginComponent)

提供外部应用组件嵌入式显示功能,即外部应用提供的UI可在本应用内显示。 说明: 该组件从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。本组件为系统接口。 子组件 无 接口 PluginComponent(value:…

strstr函数及其模拟实现

模拟实现的代码: char* my_strstr(char* p1, char* p2) {char* startp1;//记录被查找字符串的首地址char* begin p2;//记录要查找字符串的首地址while (1){while (*p1 ! *p2)//首元素不相同,p1向后移动一位{p1;}start p1;//找到了首元素相同的地址&am…

​如何防止网络攻击?

应对不同类型网络攻击的最佳途径是“知己”、“知彼”,在了解它们的工作原理、能够识别其手段、方法及意图的前提下,找出针对性的应对文案。今天,就为大家总结以下防止不同类型网络攻击的有效方法,希望无论是对个人、还是企业和组…

在文件夹下快速创建vue项目搭建vue框架详细步骤

一、首先在你的电脑目录下新建一个文件夹 进入该文件夹并打开控制台(输入cmd指令) 进入控制台后输入 vue create springboot_vue (自己指定名称) 如果出现这类报错如:npm install 的报错npm ERR! network request to http://registry.cnp…

python读取大型csv文件,降低内存占用,提高程序处理速度

文章目录 简介读取前多少行读取属性列逐块读取整个文件总结参考资料 简介 遇到大型的csv文件时,pandas会把该文件全部加载进内存,从而导致程序运行速度变慢。 本文提供了批量读取csv文件、读取属性列的方法,减轻内存占用情况。 import pand…

纯前端Web网页内嵌AutoCAD,支持在线编辑DWG、dxf等文档。

随着企业信息化的发展,越来越多的企业有网页在线浏览和编辑DWG文档(AutoCad生成的文档)的需求,但是新版浏览器纷纷取消了对NPAPI插件的支持,导致之前一些可以在线在线浏览和编辑DWG文档纷纷失效,今天推荐一…

【掌握版本控制:Git 入门与实践指南】操作仓库文件|分支管理

🎬慕斯主页:修仙—别有洞天 ♈️今日夜电波:泥中に咲く—ウォルピスカーター 0:34━━━━━━️💟──────── 4:46 🔄 ◀️ ⏸ ▶…

揭秘反向代理:探索其神秘之处

🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 🍚 蓝桥云课签约作者、上架课程《Vue.js 和 E…

141 Linux 系统编程18,线程,ps –Lf 进程 查看LWP,线程间共享数据,优缺点,编译加-lpthread,

一 线程概念 什么是线程 LWP:light weight process 轻量级的进程,本质仍是进程(在Linux环境下) 进程:独立地址空间,拥有PCB 线程:有独立的PCB,但没有独立的地址空间(共享) 区别:在于是否共…

【1688运营】如何拆解竞争对手店铺和单品数据?

关注竞争对手数据是1688运营中不可或缺的一环,它有助于企业更好地了解市场环境、发现市场机会、学习成功经验、预测市场变化以及提升竞争力。以下是一些建议,帮助你全面、深入地分析竞争对手的店铺和单品数据: 1、监控店铺数据 可以通过店雷…

Docker部署黑马商城项目笔记

部署后端 创建mysql目录如下,上传对应的文件 运行以下命令 docker run -d \--name mysql \-p 3306:3306 \-e TZAsia/Shanghai \-e MYSQL_ROOT_PASSWORD123 \-v ./mysql/data:/var/lib/mysql \-v ./mysql/conf:/etc/mysql/conf.d \-v ./mysql/init:/docker-entry…

mac redis启动,redis哨兵模式,redis集群的相关命令

Homebrew安装的软件会默认在/usr/local/Cellar/路径下 redis的配置文件redis.conf存放在/usr/local/etc路径下 cd /usr/local/Cellar/redis/7.0.10. 存在 cd /usr/local/opt/redis/bin/redis-server. 目录存在 cd /usr/local/etc/redis.conf 存在。配置文件 复制文件 cp …

深入浅出计算机网络 day.1 概论④ 计算机网络的定义和分类

不要退却,要绽放魅力 我的心会共鸣 和你 —— 24.3.9 一、计算机网络的定义 计算机网络早期的一个最简单定义 现阶段计算机网络的一个较好的定义 二、计算机网络的分类 按交换方式分类 按使用者分类 按传输介质分类 按覆盖范围分类 按拓扑结构分类,可…

2m高分辨率土地利用分类矢量数据/植被类型分布数据

土地利用数据是在根据影像光谱特征,结合野外实测资料,同时参照有关地理图件,对地物的几何形状,颜色特征、纹理特征和空间分布情况进行分析,建立统一解译标志的基础之上,依据多源卫星遥感信息,结…

细粒度IP定位参文2(Corr-SLG):A street-level IP geolocation method (2021年)

[2]S. Ding, F. Zhao, and X. Luo, “A street-level IP geolocation method based on delay-distance correlation and multilayered common routers,” Secur. Commun. Netw., vol. 2021, no. 1, pp. 1–10, 2021. 智能设备的地理位置可以帮助提供多媒体内容提供商和5G网络中…

数据结构中的堆(Java)

文章目录 把普通数组转换大顶堆数组堆增删改查替换堆排序 把普通数组转换大顶堆数组 该方式适用索引为0起点的堆 在堆(Heap)这种数据结构中,节点被分为两类:叶子节点(Leaf Nodes)和非叶子节点(N…

Spring事务及事务传播机制

目录 一、什么是事务 二、事务的操作 三、Spring下实现事务 1、Spring编程式事务 (1)事务提交 (2)事务回滚 2、Spring声明式事务 (1)无异常--提交 (2)异常且不捕获--回滚 …

电机特性学习

电机特性 电机堵转: 电机堵转的原理 玻璃升降器: 工作电压 升降器在 9V~16V 电压下应运行平稳,不允许有异音和卡滞现象。 工作电流 升降器的工作电流不大于 12A,堵转电流不大于 28A。 堵转 力 升降器 堵转 力应 不小于 212N。 玻璃升降器结构 电动车窗…

删除数据表

oracle从入门到总裁:​​​​​​https://blog.csdn.net/weixin_67859959/article/details/135209645 删除数据表属于数据库对象的操作 drop table 表名称; 删除 emp30 表 SQL> drop table emp30;表已删除。 上面这个语句运行后,就会把数据表 emp30 删除 在…