当前位置: 首页 > news >正文

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) => {
    // 处理失败情况,可能是超时或其他原因
  });

 

 

 

相关文章:

Promise其实也不难

难点图解:then()方法 ES6学习网站:ES6 入门教程 解决:回调地狱(回调函数中嵌套回调) 两个特点: (1)对象的状态不受外界影响。Promise对象代表一个异步操作&…...

吴恩达 x Open AI ChatGPT ——如何写出好的提示词视频核心笔记

核心知识点脑图如下: 1、第一讲:课程介绍 要点1: 上图展示了两种大型语言模型(LLMs)的对比:基础语言模型(Base LLM)和指令调整语言模型(Instruction Tuned LLM&#xff0…...

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’&#xff0c;使你F12时一直卡在debugger&#xff0c;这种措施会让新手朋友束手无策。 js中创建debugger的方式有很多&#xff0c;基础的形式有&#xff1a; ①直接创建debugger debugger; ②通过eval创建debugger&#xff08;在虚拟机中…...

数据库基础理论知识

1.基本概念 数据(Data)&#xff1a;数据库存储的基本对象。数字、字符串、图形、图像、音频、视频等数据库(DB)&#xff1a;在计算机内&#xff0c;永久存储、有组织、可共享的数据集合数据库管理系统(DBMS)&#xff1a;管理数据库的系统软件数据库系统(DBS):DBDBMSDBADBAP 数…...

华为OD机试真题-模拟目录管理-2024年OD统一考试(C卷)

题目描述: 实现一个模拟目录管理功能的软件,输入一个命令序列,输出最后一条命令运行结果。 支持命令: 1)创建目录命令:mkdir 目录名称,如mkdir abc为在当前目录创建abc目录,如果已存在同名目录则不执行任何操作。此命令无输出。 2)进入目录命令:cd 目录名称, 如cd …...

yield代码解释

目录 我们的post请求爬取百度翻译的代码 详细解释 解释一 解释二 再说一下callback 总结 发现了很多人对存在有yield的代码都不理解&#xff0c;那就来详细的解释一下 我们的post请求爬取百度翻译的代码 import scrapy import jsonclass TestpostSpider(scrapy.Spider):…...

C#四部曲(知识补充)

Unity跨平台原理 .Net相关 只要编写的时候遵循.NET的这些规则&#xff0c;就能在.NET平台下通用 各种源码→根据.NET规范编写→(虚拟机)生成CIL中间码(保存在程序集中)→转成操作系统原代码 跨语言← 跨平台↓ Unity跨平台原理&#xff08;Mono&#xff09; c#脚本→MonoC#编…...

Vue中的数据交互有几种方式

1. 单向数据流&#xff1a; Vue中的数据流是单向的&#xff0c;从父组件传递到子组件。父组件可以通过props将数据传递给子组件&#xff0c;子组件通过props接收并使用这些数据。这种方式适用于父子组件之间的简单通信。 2. 事件&#xff1a; 子组件可以通过触发自定义事件来…...

2.MySQL中的数据类型

整数类型&#xff1a; tinyint(m): 1个字节 范围(-128~127) 常用&#xff1a;性别 0和1表示性别&#xff1b;状态 0和1表示 int(m): 4个字节 范围(-2147483648~2147483647) 常用&#xff1a;数值 数值类型中的长度m是值显示长度&#xff0c;只有字段指定zerofill时有用 例如…...

身份证查询真伪-三要素查验-ios身份证实名认证接口调用

身份证实名认证接口联网核验是实名认证的关键一步&#xff0c;通过翔云OCR识别出的身份证信息&#xff0c;联网上传全国人口数据库&#xff0c;通过比对查找&#xff0c;确认人口数据库是否有身份证号和姓名匹配的信息&#xff0c;如果有那就确认身份证是真的&#xff0c;如果没…...

@EnableWebMvc介绍和使用详细demo

EnableWebMvc是什么 EnableWebMvc 是 Spring MVC 中的一个注解&#xff0c;它用于启用 Spring MVC 框架的基本功能&#xff0c;以便你可以使用 Spring MVC 提供的特性来处理 Web 请求。 通常情况下&#xff0c;在基于 Spring Boot 的应用中&#xff0c;并不需要显式地使用 Ena…...

VC-旅游系统-213-(代码+说明)

转载地址: http://www.3q2008.com/soft/search.asp?keyword旅游系统 旅游信息管理系统开题报告 一、研究目的 旅游信息管理系统能帮助旅行社在游客的市场开拓、游客的信息管理、客户服务等方面进行综合处理。使旅行社能够准确的掌握客户的市场动态&#xff0c;充分了解对客户…...

重学SpringBoot3-ErrorMvcAutoConfiguration类

更多SpringBoot3内容请关注我的专栏&#xff1a;《SpringBoot3》 期待您的点赞&#x1f44d;收藏⭐评论✍ 重学SpringBoot3-ErrorMvcAutoConfiguration类 ErrorMvcAutoConfiguration类的作用工作原理定制 ErrorMvcAutoConfiguration示例代码1. 添加自定义错误页面2.自定义错误控…...

剑指offer面试题34 丑数

考察点 空间换时间提效知识点 题目 分析 这里面其实用到了一点点的数学知识&#xff0c;丑数的定义是只包含2&#xff0c;3&#xff0c;5因子的数。现在要求第1500个丑数&#xff0c;最简单的办法就是从数字1开始遍历&#xff0c;依次判断每个数字是不是丑数&#xff0c;如果…...

Music Tag Web:3大核心能力重塑你的音乐库管理体验

Music Tag Web&#xff1a;3大核心能力重塑你的音乐库管理体验 【免费下载链接】music-tag-web 音乐标签编辑器&#xff0c;可编辑本地音乐文件的元数据&#xff08;Editable local music file metadata.&#xff09; 项目地址: https://gitcode.com/gh_mirrors/mu/music-tag…...

5分钟为Windows 11 24H2 LTSC恢复微软应用商店:小白也能懂的完整教程

5分钟为Windows 11 24H2 LTSC恢复微软应用商店&#xff1a;小白也能懂的完整教程 【免费下载链接】LTSC-Add-MicrosoftStore Add Windows Store to Windows 11 24H2 LTSC 项目地址: https://gitcode.com/gh_mirrors/ltscad/LTSC-Add-MicrosoftStore 还在为Windows 11 24…...

Diablo Edit2:革新性暗黑破坏神II角色编辑工具,一站式定制你的完美角色

Diablo Edit2&#xff1a;革新性暗黑破坏神II角色编辑工具&#xff0c;一站式定制你的完美角色 【免费下载链接】diablo_edit Diablo II Character editor. 项目地址: https://gitcode.com/gh_mirrors/di/diablo_edit Diablo Edit2是一款功能强大的开源暗黑破坏神II角色…...

保姆级教程:用Python搞定数美滑块验证码(含DES加密还原与轨迹模拟)

Python实战&#xff1a;数美滑块验证码全流程破解指南 每次看到那个烦人的滑块验证码&#xff0c;是不是都有种想砸键盘的冲动&#xff1f;特别是当你的爬虫程序在数据采集过程中频繁触发数美验证时&#xff0c;整个项目进度可能都会被拖慢。作为爬虫开发者&#xff0c;我们需要…...

超离谱!iOS 26.0.1 Filza 管理器发布,有效可用

Filza 内置 DarkSword 利用已发布&#xff0c;支持更多系统版本。 注意&#xff01;System 目录仍然无法修改&#xff0c;仅对 var/mobile 目录。能实现读取、写入、删除等操作。有点离谱&#xff01;Little_34306 作者刚发布网页版授权 Filza 方法&#xff0c;现在又发布 Fi…...

Java SpringBoot+Vue3+MyBatis 信息化在线教学平台系统源码|前后端分离+MySQL数据库

摘要 随着信息技术的快速发展&#xff0c;教育行业正逐步向数字化、智能化转型。传统的线下教学模式受限于时间和空间&#xff0c;难以满足现代教育的高效性和灵活性需求。在线教学平台通过整合互联网技术与教育资源&#xff0c;为师生提供了便捷的交互渠道&#xff0c;有效提升…...

B站资源下载终极指南:3分钟掌握BiliTools跨平台工具箱

B站资源下载终极指南&#xff1a;3分钟掌握BiliTools跨平台工具箱 【免费下载链接】BiliTools A cross-platform bilibili toolbox. 跨平台哔哩哔哩工具箱&#xff0c;支持下载视频、番剧等等各类资源 项目地址: https://gitcode.com/GitHub_Trending/bilit/BiliTools 还…...

MOCo. x 姆明快闪店美陈设计为何刷屏出圈?肆墨设计

在商业空间同质化加剧的当下&#xff0c;快闪店已成为品牌破圈、链接消费者的核心载体。MO&Co. 携手经典 IP 姆明打造的「姆明划水俱乐部」全国首展&#xff0c;以成熟的美陈设计逻辑&#xff0c;实现了品牌调性、IP 情感与商业转化的三重统一&#xff0c;为 IP 联名快闪美…...

网易云无损解析工具:高效解析与资源管理全指南

网易云无损解析工具&#xff1a;高效解析与资源管理全指南 【免费下载链接】Netease_url 网易云无损解析 项目地址: https://gitcode.com/gh_mirrors/ne/Netease_url 在数字音乐收藏领域&#xff0c;用户常面临音质受限、批量下载繁琐、元数据缺失三大核心痛点。网易云无…...

3步完成B站视频转文字:免费开源工具bili2text终极指南

3步完成B站视频转文字&#xff1a;免费开源工具bili2text终极指南 【免费下载链接】bili2text Bilibili视频转文字&#xff0c;一步到位&#xff0c;输入链接即可使用 项目地址: https://gitcode.com/gh_mirrors/bi/bili2text 还在为手动记录B站视频内容而烦恼吗&#x…...