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

promise的用法以及注意事项,看了这篇你就会了

一,为什么要使用promise,ta能解决那些问题?

Promise 是异步编程的一种解决方案: 从语法上讲,Promise是一个对象,从它可以获取异步操作的消息;从本意上讲,它是承诺,承诺它过一段时间会(resolve)给你一个结果。ta有三种状态:pending(等待态)fulfiled(成功态)rejected(失败态),一旦状态有pending状态转为后两者之一就不可逆转,也就是说成功和失败之间是不可转换的。new一个promise之后,ta就是会立即执行。

【互联网行业信息差】全网自媒体:公@众@号,小@红@薯!打工太累,聊聊互联网趣事!

看代码:

let P = new Promise((resolve,reject) => {setTimeout(() => {resolve(1)}, 3000)
});
P.then(data => {console.log(data)
}, err => {})

说明: 这里new了一个Promise,new Promise(execut);这里的execut会立即执行。p.then也会立即执行,这个then究竟做了什么呢?后面会说!

我们再来说一下在没有Promise之前,我们写代码经常遇到的一个问题(回调地狱):

function fn(a,cb){setTimeout(() => {a = 10 * Math.random()cb(a)           //这里就是cb需要等待},300)
}function fn1(c){if(c>5){console.log(c)}else{console.log('值偏小')}
}fn(0,fn1)

有时候我们为了等待某个值需要嵌套很多层,这样为了解决这个问题Promise就应运而生了,Promise是用来解决以下几个问题的:

  1. 解决多层嵌套问题,也就是我们常说的回调地狱(then);
  2. 解决多个异步 请求问题(all,race)

我们来看看用promise怎么写上面的代码:

let p1 = new Promise((resolve, reject)=>{setTimeout(() => {a = 10 * Math.random()resolve(a)           //这里就是cb需要等待},300)
})p1.then(data => {fn1(data)
})

特别是多层嵌套的时候,Promise的好处将更加明显!


【互联网行业信息差】全网自媒体:公@众@号,小@红@薯!打工太累,聊聊互联网趣事!

二,下面跟着我一起学习一下Promise的常见用法吧!

Promise是一个构造函数,自己身上有reject,resolve,all,race这几个方法,原型上有then、catch等方法。

Promise的构造函数接收一个参数:函数(执行器,这个执行器是立即执行的),并且这个函数需要传入两个参数:

  • resolve :异步操作执行成功后的回调函数
  • reject:异步操作执行失败后的回调函数
    你需要注意的是 在Promise的执行器里面必须要有resolve,或者reject这两个回调函数执行。通过resolve或则reject来改变Promise的状态为成功或者失败,并且执行then里面的成功函数或者失败的函数。
【互联网行业信息差】全网自媒体:公@众@号,小@红@薯!打工太累,聊聊互联网趣事!
then 链式操作的用法

从表面上看,Promise只是能够简化层层回调的写法,而实质上,Promise的精髓是“状态”,用传递状态的方式来使得回调函数队列能够及时调用,所以使用Promise的正确场景是这样的:

function fn1(c){if(c>5){console.log(c)}else{console.log('值偏小')}
}
let p1 = new Promise((resolve, reject)=>{setTimeout(() => {a = 10 * Math.random()resolve(a)           //这里就是cb需要等待},300)
})p1.then(data => {fn1(data)return data
})
.then((data) => {console.log(data)   //1.333
})
.then((data) => {console.log(data)   //undefined
})

这里顺带讲一下 then的传递:如果then里面的回调返回的是一个Promise,那么就将这个Promise的resolve的值传递给下一个then的data值,如果返回的是一个普通值,那么就将这个普通值传递给下一个then的data值,例如上面的结果。

reject的用法

将Promise的状态置为rejected,这样我们在then中就能捕捉到,然后执行“失败”情况的回调。这里就不再详细叙述。

catch的用法

它是做什么用的呢?其实它和then的第二个参数一样,用来指定reject的回调。这里就不再详细叙述。

all的用法
let Promise1 = new Promise(function(resolve, reject){setTimeout(() => {resolve(1)},300)})
let Promise2 = new Promise(function(resolve, reject){setTimeout(() => {resolve(2)},200)
})
let Promise3 = new Promise(function(resolve, reject){setTimeout(() => {resolve(3)},100)
})let p = Promise.all([Promise1, Promise2, Promise3])p.then((data) => {console.log(data)    //[1,2,3]   这里的顺序和all的顺一样,和异步回调执行得到结果的顺序无关// 三个都成功则成功  
}, function(){// 只要有一个失败,则失败 
})

有了all,你就可以并行执行多个异步操作,并且在一个回调中处理所有的返回数据,是不是很方便!

【互联网行业信息差】全网自媒体:公@众@号,小@红@薯!打工太累,聊聊互联网趣事!
race的用法
let Promise1 = new Promise(function(resolve, reject){setTimeout(() => {resolve(1)},300)})
let Promise2 = new Promise(function(resolve, reject){setTimeout(() => {resolve(2)},200)
})
let Promise3 = new Promise(function(resolve, reject){setTimeout(() => {resolve(3)},100)
})let p = Promise.race([Promise1, Promise2, Promise3])p.then((data) => {console.log(data)// 三个都成功则成功  
}, function(){// 只要有失败,则失败 
})

以最先得到的结果为准,即使如果最先拿回来的是reject的结果,那么race就是reject的结果。


好了,promise的常见用法就这些,下一篇我们来聊聊promise的源码!

相关文章:

promise的用法以及注意事项,看了这篇你就会了

一,为什么要使用promise,ta能解决那些问题? Promise 是异步编程的一种解决方案: 从语法上讲,Promise是一个对象,从它可以获取异步操作的消息;从本意上讲,它是承诺,承诺它过一段时间…...

vue3如何使用pinia设置全局状态,附常见面试题

1. stores/index.ts 文件 在 index.ts 中创建 store 实例并封装了注册逻辑,这样可以方便地将整个 Pinia 实例注册到 Vue 应用中。代码如下: import type { App } from vue import { createPinia } from piniaconst store createPinia()// 全局注册 st…...

lerna+umi ‘max‘ 不是内部或外部命令,也不是可运行的程序

lerna不管version7还是老版都报 $ max setup max 不是内部或外部命令,也不是可运行的程序 或批处理文件。 error Command failed with exit code 1. 这点问题是因为lerna没编译完成; 解决: 首先我们在lerna packages 里用cli 安装umi;然后…...

美格智能5G车规级通信模组: 5G+C-V2X连接汽车通信未来十年

自2019年5G牌照发放开始,经过五年发展,我国5G在基础设施建设、用户规模、创新应用等方面均取得了显著成绩,5G网络建设也即将从基础的大范围覆盖向各产业融合的全场景应用转变。工业和信息化部数据显示,5G行业应用已融入76个国民经…...

「C/C++」C/C++ 指针篇 之 指针运算

✨博客主页何曾参静谧的博客📌文章专栏「C/C」C/C程序设计📚全部专栏「VS」Visual Studio「C/C」C/C程序设计「UG/NX」BlockUI集合「Win」Windows程序设计「DSA」数据结构与算法「UG/NX」NX二次开发「QT」QT5程序设计「File」数据文件格式「PK」Parasoli…...

计算机网络网络层笔记

互联网提供的两种服务 1.虚电路服务 2.数据报服务 需要记住的是现在只用第二种也就是数据报服务 网际协议IP 物理层的中断系统:转发器(hub) 链路层的中断系统:交换机 网络层的中断系统:路由器 网络层以上:网关 如上图所示,网关是用来访问其他的网段的一个接口,网关的地…...

长亭那个检测能力超强的 WAF,出免费版啦

告诉你们一个震撼人心的消息,那个检测能力超强的 WAF——长亭雷池,他推出免费社区版啦,体验地址见文末。 八年前我刚从学校毕业,在腾讯做安全研究,看到宇森在 BlackHat 上演讲的议题 《永别了,SQL 注入》 …...

rabbitMQ RabbitTemplate 发送消息

消息发送确认机制 消息发送确认机制:消息由producer发送后,确认其是否到达broker,又是否被exchange转发至对应queue的机制 该机制分为两部分:producer---broker,exchange---queue 前者的实现依靠ConfirmCallback机制…...

本系列是《10万字208道Java经典面试题总结(附答案)》的2024修订版。

公众号 后端学习指南 本系列是《10万字208道Java经典面试题总结(附答案)》的2024修订版。 1、说说跨平台性 我们希望编写好的代码和程序,最好可以在任意平台和环境下运行,而不需要根据不同的平台,编写不同的代码。 比如,我编写的一个博客管理系统,我希望它可以在windo…...

C语言文件基础概念的理解(一)

文件基础概念 为什么有文件? 我们写的程序的数据是存储在电脑的内存中,如果程序退出,内存回收,数据就丢失 了,等再次运⾏程序,是看不到上次程序的数据的,如果要将数据进⾏持久化的保存&#xf…...

C++ lambda 匿名函数

看了明仕强老师的课程&#xff0c;C匿名函数也可以很简单 下面请看示例代码&#xff1a; /* lambda表达式学习&#xff0c;测试主函数 */#include <iostream>using namespace std;int main() {printf("Lambda test Demo:\n");//值捕获,值捕获的时候不能修…...

基于python的简单web服务器示例

安装flask flask 简介&#xff1a;是一个用Python编写的Web应用程序框架。 它由 Armin Ronacher 开发&#xff0c;他领导一个名为Pocco的国际Python爱好者团队。 Flask基于Werkzeug WSGI工具包和Jinja2模板引擎。两者都是Pocco项目 新建项目 创建好的效果 pip list 检索 安装…...

02- 模块化编程-006 ADC0808数码显示对比

1、ADC0808 芯片介绍 ADC0808是一款集成的CMOS设备&#xff0c;包含8位模拟至数字转换器、8通道多路复用器和与微处理器兼容的控制逻辑。8位A/D转换器采用逐次逼近作为转换技术。转换器特点包括高阻抗斩波稳定比较器、256R电压分压器、模拟开关树和逐次逼近寄存器。8通道多路复…...

又发现了Mac妙控鼠标的新使用方法

我一直是不爱用妙控鼠标的&#xff0c;因为用起来怪怪的&#xff0c;但是今天发现BettreAndBetter支持妙控鼠标的修改&#xff0c;于是就找出了闲置了许久的妙控鼠标试了一下 优化后的妙控鼠标使用起来就没有任何不适应的地方了&#xff0c;三指按下模拟中键&#xff0c;而且还…...

Webserver(4.6)poll和epoll

目录 pollclient.cpoll.c epollepoll.cclient.c epoll的两种工作模式水平触发边沿触发 poll poll是对select的一个改进 select的缺点在于每次都需要将fd集合从用户态拷贝到内核态&#xff0c;开销很大。每次调用select都需要在内核遍历传递进来的所有fd&#xff0c;这个开销也…...

LVGL 与 QT

LVGL 与 QT LVGL 适用于嵌入式、资源受限设备&#xff0c;尤其是在需要高效图形渲染和小型显示屏的场景下非常合适。它具有轻量级、模块化的特点&#xff0c;适用于内存和计算能力有限的硬件。 Qt 是一个功能强大的跨平台框架&#xff0c;适合开发桌面应用以及较为复杂的嵌入式…...

如何选择最适合的项目管理软件?2024年大厂首选7款工具盘点

选择最适合的项目管理软件对于提升团队效率、优化工作流程至关重要。2024年&#xff0c;各大厂在项目管理上逐渐趋向于使用更加智能化、集成化和协作性的工具。以下是如何选择最适合的项目管理软件&#xff0c;并对2024年大厂首选工具进行盘点。 选择适合的项目管理软件的关键…...

【数据结构】选择排序——选择排序 和 堆排序

选择排序 和 堆排序 一、选择排序选择排序的思路及其代码选择排序的弊端 二、堆排序三、速度对比同时排10000个数同时排100000个数同时拍500000个数堆排 1 亿个数 一、选择排序 选择排序的思路及其代码 选择排序思路很简单 就是经过将数组遍历选择最小值 将最小值位置的数与数…...

P11229 [CSP-J 2024] 小木棍

[CSP-J 2024] 小木棍 题目描述 小 S 喜欢收集小木棍。在收集了 n n n 根长度相等的小木棍之后&#xff0c;他闲来无事&#xff0c;便用它们拼起了数字。用小木棍拼每种数字的方法如下图所示。 现在小 S 希望拼出一个正整数&#xff0c;满足如下条件&#xff1a; 拼出这个数…...

【学习笔记】SAP ABAP——OPEN SQL(一)【SELECT语句】

SELECT语句简介 SELECT <lines> <columns> FROM <db> WHERE <condition>其中代表查询的件数&#xff0c;代表查询的字段名 SELECT SINGLE SELECT SINGLE <cols> FROM <db> WHERE <condition>该语句用于从数据库表中查询单条数据 …...

Spark 之 入门讲解详细版(1)

1、简介 1.1 Spark简介 Spark是加州大学伯克利分校AMP实验室&#xff08;Algorithms, Machines, and People Lab&#xff09;开发通用内存并行计算框架。Spark在2013年6月进入Apache成为孵化项目&#xff0c;8个月后成为Apache顶级项目&#xff0c;速度之快足见过人之处&…...

树莓派超全系列教程文档--(62)使用rpicam-app通过网络流式传输视频

使用rpicam-app通过网络流式传输视频 使用 rpicam-app 通过网络流式传输视频UDPTCPRTSPlibavGStreamerRTPlibcamerasrc GStreamer 元素 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 使用 rpicam-app 通过网络流式传输视频 本节介绍来自 rpica…...

【JVM】- 内存结构

引言 JVM&#xff1a;Java Virtual Machine 定义&#xff1a;Java虚拟机&#xff0c;Java二进制字节码的运行环境好处&#xff1a; 一次编写&#xff0c;到处运行自动内存管理&#xff0c;垃圾回收的功能数组下标越界检查&#xff08;会抛异常&#xff0c;不会覆盖到其他代码…...

[Java恶补day16] 238.除自身以外数组的乘积

给你一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&#xff0c;且在 O(n) 时间复杂度…...

C++八股 —— 单例模式

文章目录 1. 基本概念2. 设计要点3. 实现方式4. 详解懒汉模式 1. 基本概念 线程安全&#xff08;Thread Safety&#xff09; 线程安全是指在多线程环境下&#xff0c;某个函数、类或代码片段能够被多个线程同时调用时&#xff0c;仍能保证数据的一致性和逻辑的正确性&#xf…...

使用 Streamlit 构建支持主流大模型与 Ollama 的轻量级统一平台

🎯 使用 Streamlit 构建支持主流大模型与 Ollama 的轻量级统一平台 📌 项目背景 随着大语言模型(LLM)的广泛应用,开发者常面临多个挑战: 各大模型(OpenAI、Claude、Gemini、Ollama)接口风格不统一;缺乏一个统一平台进行模型调用与测试;本地模型 Ollama 的集成与前…...

技术栈RabbitMq的介绍和使用

目录 1. 什么是消息队列&#xff1f;2. 消息队列的优点3. RabbitMQ 消息队列概述4. RabbitMQ 安装5. Exchange 四种类型5.1 direct 精准匹配5.2 fanout 广播5.3 topic 正则匹配 6. RabbitMQ 队列模式6.1 简单队列模式6.2 工作队列模式6.3 发布/订阅模式6.4 路由模式6.5 主题模式…...

【无标题】路径问题的革命性重构:基于二维拓扑收缩色动力学模型的零点隧穿理论

路径问题的革命性重构&#xff1a;基于二维拓扑收缩色动力学模型的零点隧穿理论 一、传统路径模型的根本缺陷 在经典正方形路径问题中&#xff08;图1&#xff09;&#xff1a; mermaid graph LR A((A)) --- B((B)) B --- C((C)) C --- D((D)) D --- A A -.- C[无直接路径] B -…...

Unity UGUI Button事件流程

场景结构 测试代码 public class TestBtn : MonoBehaviour {void Start(){var btn GetComponent<Button>();btn.onClick.AddListener(OnClick);}private void OnClick(){Debug.Log("666");}}当添加事件时 // 实例化一个ButtonClickedEvent的事件 [Formerl…...

苹果AI眼镜:从“工具”到“社交姿态”的范式革命——重新定义AI交互入口的未来机会

在2025年的AI硬件浪潮中,苹果AI眼镜(Apple Glasses)正在引发一场关于“人机交互形态”的深度思考。它并非简单地替代AirPods或Apple Watch,而是开辟了一个全新的、日常可接受的AI入口。其核心价值不在于功能的堆叠,而在于如何通过形态设计打破社交壁垒,成为用户“全天佩戴…...