当前位置: 首页 > 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>该语句用于从数据库表中查询单条数据 …...

SQL注入(1)

1.数字型注入 例如PHP代码 “ Select username from users where id”.&#xff04;&#xff3f;GET&#xff3b;id&#xff3d; 可以注意到&#xff0c;用户的输入ID字段没有任何过滤的&#xff0c;被直接拼接在了SQL查询语句中&#xff0c;由于ID没有被引号包裹&#xff…...

在AI时代,如何解决人的工作岗位被AI替代的问题?

在AI时代&#xff0c;工作岗位被AI替代的问题确实是一个重要的社会课题。随着技术的不断进步&#xff0c;许多传统的工作变得自动化&#xff0c;这带来了效率的提升&#xff0c;但也引发了就业方面的挑战。要应对这一问题&#xff0c;我们可以从以下几方面入手&#xff1a; 促进…...

Linux命令--paste

简介 paste命令用于合并文件行 参数说明 -d: 自定义间隔符&#xff0c;默认为tab -s&#xff1a;串行处理&#xff0c;非并行 示例 将两个文件&#xff0c;按照行合并 demo1.conf内容如下&#xff1a; name domain ip area user password roledemo2.conf内容如下 test t…...

数据结构模拟题[九]

数据结构试卷&#xff08;九&#xff09; 一、选择题 (30 分) 1&#xff0e;下列程序段的时间复杂度为&#xff08; &#xff09;。 for(i0 &#xff1b; i<m &#xff1b; i) for(j0 &#xff1b; j<t &#xff1b; j) c[i][j]0 &#xff1b; for(i0 &#xff1b; i…...

2024年10月国产数据库大事记-墨天轮

本文为墨天轮社区整理的2024年10月国产数据库大事件和重要产品发布消息。 目录 2024年10月国产数据库大事记 TOP102024年10月国产数据库大事记&#xff08;时间线&#xff09;产品/版本发布代表厂商大事记信创数据库上市公司2024年Q3财报 达梦数据&#xff1a;2024年前三季度…...

Andon 业务流程业务开发陷阱----从真实用户与管理者视角逻辑差异

Q : Andon 问题识别归类(就是问题的3层细化)&#xff0c;是在事中&#xff0c;还是在事后? A : 不存在事中就细化归类&#xff0c;有悖于生产问题解决流程。 从操作员的角度来看&#xff0c;他们在事中可能只能识别出存在质量问题&#xff0c;但无法进行具体的质量问题编号…...

Python闭包|你应该知道的常见用例(上)

引言 在 Python 编程语言中&#xff0c;闭包通常指的是一个嵌套函数&#xff0c;即在一个函数内部定义的另一个函数。这个嵌套的函数能够访问并保留其外部函数作用域中的变量。这种结构就构成了一个闭包。 闭包在函数式编程语言中非常普遍。在 Python 中&#xff0c;闭包特别有…...

printf影响单片机中断速度

printf是我们常用的调试程序的手段&#xff0c;在第一版程序中&#xff0c;经常会使用printf来验证程序是否工作正确。这样的调试手段应该在正式版的程序发布前注释掉或者删除。而且不当地使用printf也会带来某些功能性问题&#xff0c;例如&#xff0c;在某项目中&#xff0c;…...

JavaScript 23种经典设计模式简介

23种JavaScript经典设计模式 JavaScript经典设计模式 通过之前的学习&#xff0c;我们知道设计模式是一种解决代码组织、代码复用和代码可维护性等问题的技术方法。它通过将代码以特定的方式组织起来&#xff0c;使代码结构更加清晰、可读性更高、易于维护和扩展。为了在开发…...

位运算相关算法

一、异或运算介绍 1、性质介绍 异或运算&#xff08;XOR&#xff0c;Exclusive OR&#xff09;是一种位运算符。对于两个位进行异或操作&#xff0c;当且仅当这两个位不同时&#xff0c;结果为 1&#xff1b;如果相同&#xff0c;则结果为 0。 A B A^B00001 1 101110 任何数…...