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

第19节 Node.js Express 框架

Express 是一个为Node.js设计的web开发框架&#xff0c;它基于nodejs平台。 Express 简介 Express是一个简洁而灵活的node.js Web应用框架, 提供了一系列强大特性帮助你创建各种Web应用&#xff0c;和丰富的HTTP工具。 使用Express可以快速地搭建一个完整功能的网站。 Expre…...

Chapter03-Authentication vulnerabilities

文章目录 1. 身份验证简介1.1 What is authentication1.2 difference between authentication and authorization1.3 身份验证机制失效的原因1.4 身份验证机制失效的影响 2. 基于登录功能的漏洞2.1 密码爆破2.2 用户名枚举2.3 有缺陷的暴力破解防护2.3.1 如果用户登录尝试失败次…...

Android Wi-Fi 连接失败日志分析

1. Android wifi 关键日志总结 (1) Wi-Fi 断开 (CTRL-EVENT-DISCONNECTED reason3) 日志相关部分&#xff1a; 06-05 10:48:40.987 943 943 I wpa_supplicant: wlan0: CTRL-EVENT-DISCONNECTED bssid44:9b:c1:57:a8:90 reason3 locally_generated1解析&#xff1a; CTR…...

CTF show Web 红包题第六弹

提示 1.不是SQL注入 2.需要找关键源码 思路 进入页面发现是一个登录框&#xff0c;很难让人不联想到SQL注入&#xff0c;但提示都说了不是SQL注入&#xff0c;所以就不往这方面想了 ​ 先查看一下网页源码&#xff0c;发现一段JavaScript代码&#xff0c;有一个关键类ctfs…...

FFmpeg 低延迟同屏方案

引言 在实时互动需求激增的当下&#xff0c;无论是在线教育中的师生同屏演示、远程办公的屏幕共享协作&#xff0c;还是游戏直播的画面实时传输&#xff0c;低延迟同屏已成为保障用户体验的核心指标。FFmpeg 作为一款功能强大的多媒体框架&#xff0c;凭借其灵活的编解码、数据…...

连锁超市冷库节能解决方案:如何实现超市降本增效

在连锁超市冷库运营中&#xff0c;高能耗、设备损耗快、人工管理低效等问题长期困扰企业。御控冷库节能解决方案通过智能控制化霜、按需化霜、实时监控、故障诊断、自动预警、远程控制开关六大核心技术&#xff0c;实现年省电费15%-60%&#xff0c;且不改动原有装备、安装快捷、…...

【机器视觉】单目测距——运动结构恢复

ps&#xff1a;图是随便找的&#xff0c;为了凑个封面 前言 在前面对光流法进行进一步改进&#xff0c;希望将2D光流推广至3D场景流时&#xff0c;发现2D转3D过程中存在尺度歧义问题&#xff0c;需要补全摄像头拍摄图像中缺失的深度信息&#xff0c;否则解空间不收敛&#xf…...

376. Wiggle Subsequence

376. Wiggle Subsequence 代码 class Solution { public:int wiggleMaxLength(vector<int>& nums) {int n nums.size();int res 1;int prediff 0;int curdiff 0;for(int i 0;i < n-1;i){curdiff nums[i1] - nums[i];if( (prediff > 0 && curdif…...

【论文笔记】若干矿井粉尘检测算法概述

总的来说&#xff0c;传统机器学习、传统机器学习与深度学习的结合、LSTM等算法所需要的数据集来源于矿井传感器测量的粉尘浓度&#xff0c;通过建立回归模型来预测未来矿井的粉尘浓度。传统机器学习算法性能易受数据中极端值的影响。YOLO等计算机视觉算法所需要的数据集来源于…...

作为测试我们应该关注redis哪些方面

1、功能测试 数据结构操作&#xff1a;验证字符串、列表、哈希、集合和有序的基本操作是否正确 持久化&#xff1a;测试aof和aof持久化机制&#xff0c;确保数据在开启后正确恢复。 事务&#xff1a;检查事务的原子性和回滚机制。 发布订阅&#xff1a;确保消息正确传递。 2、性…...