Promise其实也不难
难点图解:then()方法

ES6学习网站:ES6 入门教程
解决:回调地狱(回调函数中嵌套回调)
两个特点:
(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。
(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。
创建 Promise
你可以使用 new Promise() 构造函数来创建一个 Promise。它接受一个带有 resolve 和 reject 两个参数的函数,这个函数会在异步操作完成(成功或失败)时被调用。
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

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之后等于说调用了构造函数,构造函数中传的参数是一个函数,这个函数内的两个参数分别又是两个函数(
reslove和reject)
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) => {
// 处理失败情况,可能是超时或其他原因
});
相关文章:
Promise其实也不难
难点图解:then()方法 ES6学习网站:ES6 入门教程 解决:回调地狱(回调函数中嵌套回调) 两个特点: (1)对象的状态不受外界影响。Promise对象代表一个异步操作&…...
吴恩达 x Open AI ChatGPT ——如何写出好的提示词视频核心笔记
核心知识点脑图如下: 1、第一讲:课程介绍 要点1: 上图展示了两种大型语言模型(LLMs)的对比:基础语言模型(Base LLM)和指令调整语言模型(Instruction Tuned LLM࿰…...
JVM从1%到99%【精选】-【初步认识】
目录 1.java虚拟机 2.JVM的位置 3.代码的执行流程 4.JVM的架构模型 5.JVM的生命周期 6.JVM的整体结构 1.java虚拟机 Java虚拟机是一台执行Java字节码的虚拟计算机,它拥有独立的运行机制,其运行的Java字节码也未必由Java语言编译而成。JVM平台的各种语言可以共享Java…...
pdf转图片(利用pdf2image包)
参考: pdf2image pip install pdf2image代码: from pdf2image import convert_from_path, convert_from_bytes import osoutput_folder ./xx/ dpi_value 600 pdf_start_page 1 # pdf显示的第一页 start_page 1 # 真实页码 prex # 图像前缀def to_…...
SwiftUI的转场动画
SwiftUI的转场动画 记录一下SwiftUI中的一些弹窗动画 import SwiftUIstruct TransitionBootCamp: View {State var showView falselet screenWidth UIScreen.main.bounds.widthlet screenHeight UIScreen.main.bounds.heightvar body: some View {ZStack(alignment: .botto…...
Trust Region Policy Optimization (TRPO)
Trust Region Policy Optimization (TRPO) 是一种强化学习算法,专门设计来改善策略梯度方法在稳定性和效率方面的表现。由 John Schulman 等人在 2015 年提出,TRPO 的核心思想是在策略优化过程中引入一个信任区域(trust region)&a…...
消息服务--Kafka的简介和使用
消息服务--Kafka的简介和使用 前言异步解耦削峰缓存1、消息队列2、kafka工作原理3、springBoot KafKa整合3.1 添加插件3.2 kafKa的自动配置类3.21 配置kafka地址3.22 如果需要发送对象配置kafka值的序列化器3.3 测试发送消息3.31 在发送测试消息的时候由于是开发环境中会遇到的…...
【c++11线程库的使用】
#include<iostream> #include<thread> #include<string> using namespace std; void hello(string msg) { for (int i 0; i < 1000; i) { cout << i; cout << endl; } } int main() { //1.创建线程 thread …...
无限debugger的几种处理方式
不少网站会在代码中加入‘debugger’,使你F12时一直卡在debugger,这种措施会让新手朋友束手无策。 js中创建debugger的方式有很多,基础的形式有: ①直接创建debugger debugger; ②通过eval创建debugger(在虚拟机中…...
数据库基础理论知识
1.基本概念 数据(Data):数据库存储的基本对象。数字、字符串、图形、图像、音频、视频等数据库(DB):在计算机内,永久存储、有组织、可共享的数据集合数据库管理系统(DBMS):管理数据库的系统软件数据库系统(DBS):DBDBMSDBADBAP 数…...
华为OD机试真题-模拟目录管理-2024年OD统一考试(C卷)
题目描述: 实现一个模拟目录管理功能的软件,输入一个命令序列,输出最后一条命令运行结果。 支持命令: 1)创建目录命令:mkdir 目录名称,如mkdir abc为在当前目录创建abc目录,如果已存在同名目录则不执行任何操作。此命令无输出。 2)进入目录命令:cd 目录名称, 如cd …...
yield代码解释
目录 我们的post请求爬取百度翻译的代码 详细解释 解释一 解释二 再说一下callback 总结 发现了很多人对存在有yield的代码都不理解,那就来详细的解释一下 我们的post请求爬取百度翻译的代码 import scrapy import jsonclass TestpostSpider(scrapy.Spider):…...
C#四部曲(知识补充)
Unity跨平台原理 .Net相关 只要编写的时候遵循.NET的这些规则,就能在.NET平台下通用 各种源码→根据.NET规范编写→(虚拟机)生成CIL中间码(保存在程序集中)→转成操作系统原代码 跨语言← 跨平台↓ Unity跨平台原理(Mono) c#脚本→MonoC#编…...
Vue中的数据交互有几种方式
1. 单向数据流: Vue中的数据流是单向的,从父组件传递到子组件。父组件可以通过props将数据传递给子组件,子组件通过props接收并使用这些数据。这种方式适用于父子组件之间的简单通信。 2. 事件: 子组件可以通过触发自定义事件来…...
2.MySQL中的数据类型
整数类型: tinyint(m): 1个字节 范围(-128~127) 常用:性别 0和1表示性别;状态 0和1表示 int(m): 4个字节 范围(-2147483648~2147483647) 常用:数值 数值类型中的长度m是值显示长度,只有字段指定zerofill时有用 例如…...
身份证查询真伪-三要素查验-ios身份证实名认证接口调用
身份证实名认证接口联网核验是实名认证的关键一步,通过翔云OCR识别出的身份证信息,联网上传全国人口数据库,通过比对查找,确认人口数据库是否有身份证号和姓名匹配的信息,如果有那就确认身份证是真的,如果没…...
@EnableWebMvc介绍和使用详细demo
EnableWebMvc是什么 EnableWebMvc 是 Spring MVC 中的一个注解,它用于启用 Spring MVC 框架的基本功能,以便你可以使用 Spring MVC 提供的特性来处理 Web 请求。 通常情况下,在基于 Spring Boot 的应用中,并不需要显式地使用 Ena…...
VC-旅游系统-213-(代码+说明)
转载地址: http://www.3q2008.com/soft/search.asp?keyword旅游系统 旅游信息管理系统开题报告 一、研究目的 旅游信息管理系统能帮助旅行社在游客的市场开拓、游客的信息管理、客户服务等方面进行综合处理。使旅行社能够准确的掌握客户的市场动态,充分了解对客户…...
重学SpringBoot3-ErrorMvcAutoConfiguration类
更多SpringBoot3内容请关注我的专栏:《SpringBoot3》 期待您的点赞👍收藏⭐评论✍ 重学SpringBoot3-ErrorMvcAutoConfiguration类 ErrorMvcAutoConfiguration类的作用工作原理定制 ErrorMvcAutoConfiguration示例代码1. 添加自定义错误页面2.自定义错误控…...
剑指offer面试题34 丑数
考察点 空间换时间提效知识点 题目 分析 这里面其实用到了一点点的数学知识,丑数的定义是只包含2,3,5因子的数。现在要求第1500个丑数,最简单的办法就是从数字1开始遍历,依次判断每个数字是不是丑数,如果…...
C++实现分布式网络通信框架RPC(3)--rpc调用端
目录 一、前言 二、UserServiceRpc_Stub 三、 CallMethod方法的重写 头文件 实现 四、rpc调用端的调用 实现 五、 google::protobuf::RpcController *controller 头文件 实现 六、总结 一、前言 在前边的文章中,我们已经大致实现了rpc服务端的各项功能代…...
【OSG学习笔记】Day 18: 碰撞检测与物理交互
物理引擎(Physics Engine) 物理引擎 是一种通过计算机模拟物理规律(如力学、碰撞、重力、流体动力学等)的软件工具或库。 它的核心目标是在虚拟环境中逼真地模拟物体的运动和交互,广泛应用于 游戏开发、动画制作、虚…...
Mybatis逆向工程,动态创建实体类、条件扩展类、Mapper接口、Mapper.xml映射文件
今天呢,博主的学习进度也是步入了Java Mybatis 框架,目前正在逐步杨帆旗航。 那么接下来就给大家出一期有关 Mybatis 逆向工程的教学,希望能对大家有所帮助,也特别欢迎大家指点不足之处,小生很乐意接受正确的建议&…...
基于服务器使用 apt 安装、配置 Nginx
🧾 一、查看可安装的 Nginx 版本 首先,你可以运行以下命令查看可用版本: apt-cache madison nginx-core输出示例: nginx-core | 1.18.0-6ubuntu14.6 | http://archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages ng…...
Android15默认授权浮窗权限
我们经常有那种需求,客户需要定制的apk集成在ROM中,并且默认授予其【显示在其他应用的上层】权限,也就是我们常说的浮窗权限,那么我们就可以通过以下方法在wms、ams等系统服务的systemReady()方法中调用即可实现预置应用默认授权浮…...
SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)
上一章用到了V2 的概念,其实 Fiori当中还有 V4,咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务),代理中间件(ui5-middleware-simpleproxy)-CSDN博客…...
Angular微前端架构:Module Federation + ngx-build-plus (Webpack)
以下是一个完整的 Angular 微前端示例,其中使用的是 Module Federation 和 npx-build-plus 实现了主应用(Shell)与子应用(Remote)的集成。 🛠️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...
VM虚拟机网络配置(ubuntu24桥接模式):配置静态IP
编辑-虚拟网络编辑器-更改设置 选择桥接模式,然后找到相应的网卡(可以查看自己本机的网络连接) windows连接的网络点击查看属性 编辑虚拟机设置更改网络配置,选择刚才配置的桥接模式 静态ip设置: 我用的ubuntu24桌…...
C++ 设计模式 《小明的奶茶加料风波》
👨🎓 模式名称:装饰器模式(Decorator Pattern) 👦 小明最近上线了校园奶茶配送功能,业务火爆,大家都在加料: 有的同学要加波霸 🟤,有的要加椰果…...
适应性Java用于现代 API:REST、GraphQL 和事件驱动
在快速发展的软件开发领域,REST、GraphQL 和事件驱动架构等新的 API 标准对于构建可扩展、高效的系统至关重要。Java 在现代 API 方面以其在企业应用中的稳定性而闻名,不断适应这些现代范式的需求。随着不断发展的生态系统,Java 在现代 API 方…...
