腾龙娱乐公司网址Q薇99062581】 · Pull Request !43 · fhs_opensource/fhs-framework

Promise 状态

初始状态 -> pending
初始状态可以改变
在resolve 或者 reject 调用之前都处于这个状态
最终成功状态 -> fulfilled
执行 resolve 函数，状态改变为 fulfilled
执行 onFulfilled 函数
最终失败状态 -> rejected
执行 reject 函数，状态改变为 rejected
执行 onRejected 函数
then 方法
then 方法为 Promise 对象注册了 onFulfilled 和 onRejected 函数
catch 方法
catch 方法为Promise 对象注册了 onRejected 函数
1. Promise.resolve
    静态方法 Promise.resolve(value)可以认为是 new Promise方法的语法糖,比如Promise.resolve(42) 可以认为是以下代码的语法糖。

new Promise(function (resolve) {
    resolve(42)
})
     这个静态方法会让Promise对象立即进入确定(即resolved) 状态，并将42传递给后面 then 里所指定的 onFulfilled函数。作为 new Promise的快捷方式，在进行 Promise 对象的初始化或者编写测试代码的时候都非常方便。

简单总结一下 Promise.resolve方法的话，它的作用就是将传递给它的参数填充 Fulfilled 到 Promise 对象后并返回这个 Promise 对象。

2. Promise.reject
  Promise.reject(error)是和Promise.resolve(value)类似的静态方法，是 new Promise 方法的快捷方式。比如 Promise.reject(new Error("Promise reject error")) 就是下面代码的语法糖形式

new Promise(function (reject) {
    reject(new Error("Promise reject error"))
})
      简单总结一下 Promise.reject方法的话：它的功能是调用该 Promise对象通过then指定的 onRejected函数，并讲错误（Error）对象传递给这个onRejected函数

3. Promise.then
    Promise.then(onFulfilled, onRejected)

① 函调函数异步执行
 
var promise = new Promise((resolve, reject) => {
  console.log("inner Promise"); // 1
  setTimeout(() => {
    resolve("Fashion Barry"); // 3
  }, 1000);
});
 
promise.then((res) => {
  console.log("res", res);
});
console.log("outer promise"); // 2
// Promise 实际是一个同步函数，then 方法才是异步
// 所以输出顺序如上
  Promise/A+规范统一规定：Promise 只能使用异步调用方式

② 返回值   
    不管你在回调函数 onFulfilled中会返回一个什么样的值，或者不返回值，该值都会由 Promis.resolve(return 的返回值) 进行响应的包装处理。因此，最终 then的结果都是返回一个新创建的 Promise对象。

也就是说，Promis.then不仅仅是注册一个回调函数那么简单，它还会将回调函数的返回值进行变换，创建并返回一个Promise 对象。正是 then函数中有了这样返回值的机制，才能使得在整个Promise链式结构当中，每个then方法都能给 下一个then方法传递参数。现在我们知道怎么返回的Promise是之前的还是新的？另外该Promise的状态又是如何？

③ promise穿透
   我们先来举个例子：

Promise.resolve("Barry")
.then(Promise.resolve("Barry Promise"))
.then((result) => {
  console.log("result", result); // "Barry"
});
如果你认为输出的是【 Barry Promise 】，那么你就错了，实际上他输出的是 【 Barry 】

产生这么的输出是因为你给then方法传递了一个非函数(比如promise对象)的值，代码会这样理解 : then(null),因此导致了前一个promise的结果产生了坠落的效果，也就是和下面代码是一样的， 代码直接穿透了then(null)进入了下一层链：

Promise.resolve("Barry")
.then(null)
.then((result) => {
  console.log("result", result); // "Barry"
});
随意添加多个then(null)结果都是一样的

Promise.resolve("Barry")
.then(null)
.then({ name: "My name is Barry" })
.then(null)
.then((result) => {
  console.log("result", result); // "Barry"
});
4. Promise.catch
  ① 语法糖的本质
        这里我们再说一遍，实际上Promise.catch只是promise.then(undefined, onRejected) 方法的一个别名而已。也就是说，这个方法用来注册当Promise对象状态变为 Rejected时 的回调函数。可以看下面代码，两者写法是等价的，但是很明显 Promise.catch会让人第一眼看上去不会眼花缭乱:

// 第一种写法
Promise.resolve()
  .then((data) => console.log(data))
  .then(undefined, (err) => console.log(err));
 
// 第二种写法
Promise.resolve()
  .then((data) => console.log(data))
  .catch((err) => console.log(err));
那么我们现在来说说为什么推荐使用第二种方法，而不是第一种:

使用promise.then(onFulfilled, onRejected) 的话，在onFulfilled中发生异常的话，onRejected 中是捕获不到这个异常的。而且如果链式很长，每一条链上都要这么写。
在promise.then(onFulfilled).catch(onRejected) 的情况下.then中产生异常能在.catch 中捕获。.then和.catch本质上是没有区别的， 需要分场合使用
  ② 只有一个主人
        我们上面已经说过了，在书写很长的Promise链式，从代码清晰度和简易程度来讲，在最后添加 catch是远远在每一层链上写onRejected回调函数是要好的，因为catch可以捕获 Promise链中每一层节点的错误，这句话本身没有错，但从这句话延伸出一种错误的理解：catch 同时监控着所有节点。实际上catch函数在同一个时间点只属于某一个Promise，因为它的主人是随着程序 的执行而不断变化的，我们来举个例子：

在上述例子中，如果整个程序每一步都正确执行，那么会顺序产生三个Promise对象，分别是 Promise(1),Promise(2),Promise(3):

可是如果在第一层具体执行逻辑出错了后，那实际上后面的两个then 中的回调函数压根不会被异步执行，所以会直接异步触发catch中的回调函数执行， 所以这种情况下catch是Promise(1)对象的catch。
如果第一层具体执行逻辑正确执行，就会异步触发第二个then中的回调函数执行，那么同理 ，在第二次具体执行逻辑抛出错误，会导致Promise(2)的状态变化，所以这种情况下catch 是Promise(2)对象的catch。
同理Promise(3)也是如此
总结下来就是：整个Promise链中，catch只属于异步触发它当中回调函数 执行的那个Promise，并不属于所有 Promise

5. Promise.finally
    promise.finally方法的回调函数不接受任何参数，这意味着finally没有办法 知道，前面的Promise状态到底是fulfilled还是rejected 。这表明，finally方法里面的操作，应该是与Promise状态无关的，不依赖于 Promise的执行结果。我们来看下面代码：

var p1 = new Promise((resolve, rejevt) => {
  setTimeout(() => {
    resolve;
  }, 1000);
});
 
p1.then((res) => console.log(res))
  .catch((err) => console.log(err))
  .finally(() => console.log("finally"));
finally本质上是then方法的特例。我们来看下面伪代码：

promise.finally(() => {
  // 执行逻辑
});
// 上面代码等同于下面
promise.then(
  (onFulilled) => {
    // 语句
    return onFulilled;
  },
  (onRejected) => {
    // 语句
    throw onRejected;
  }
);

上面代码中，如果不使用finally方法，同样的语句需要为成功和失败的状态各写一次。 有了finally方法，则只需要写一次。那么它是如何实现的呢？

Promise.prototype.finally = function (callback) {
  let p = this.constructor;
  return this.then(
    (value) => p.resolve(callback()).then(() => value),
    (reason) =>
      p.reject(callback()).then(() => {
        throw reason;
      })
  );
};
 
var p = new Promise((resoleve, reject) => {
  setTimeout(() => {
    reject("Promise err");
  }, 1000);
});
p.catch((err) => console.log("err", err)).finally(() => {
  console.log("finally");
});

上述代码中，不管前面的Promise是fulfilled还是rejected ，都会执行回调函数callback

6. Promise.all
    Promise.all接受一个promise对象的数组作为参数，当这个数组里的所有 Promise 对象 全部变为resolve或者reject状态的时候，它才会去调用.then方法。

传递给Promise.all的 promise并不是一个个的顺序执行的，而是同时开始、并行执行的，我们可以看下面例子

为什么这个例子可以看出来Promise.all()是并行的呢？因为所有Promise执行完只用了5秒，如果3个 Promise是按照顺序执行的，那么应该是9秒或者，在5-9之间，因为4个Promise并不是同时执行的，同时执行的 话总时间就是那个花费时间最长的Promise

Promise.all()重要细节点 （面试常考）：

如果所有的Promise中只有一个执行错误，那么整个Promise.all不会走Promise.all().then() 而是走Promise.all().catch()这个流程了。但是要注意的是虽然走到了Promise.all().catch()这个流程 ，但是其他 Promise 还是会正常执行，但不会返回结果
要注意Promise.all()的返回值顺序，Promise.all().then()的返回值顺序和传入的顺序是一致的，笔试时 遇到手写Promise.all()时要注意。
7. Promise.allSettled
  Promise.allSettled()的入参和Promise.all、Promise.race一样，接受一个promise 对象的数组作为参数,也是同时开始、并行执行的。但是Promise.allSettled的返回值需要注意以下几点：

Promise.allSettled不会走进catch，当所有输入Promise都被履行或者拒绝时， statusesPromise 会解析一个具有具体完成状态的数组

{ status: 'fulfilled', value:value } ：如果相应的promise被履行
{ status: 'rejected', reason: reason }：如果相应的promise被拒绝
我们看下面示例:

总结一下：Promise.allSettled()在你需要执行平行和独立的异步操作并收集所有结果时非常有效， 即使某些异步操作可能失败。

8. Promise.race
  Promise.rece()的使用方法和 Promise.all一样，接收一个promise 对象的数组为参数，Promise.race是要有一个promise对象进入Fulfilled或者 Rejected状态的话，就会继续进行后面的处理。这里依旧有两个点要注意：

和Promise.all一样是所有数组当中的Promise同时并行的
Promise.race 在第一个Promise对象变为Fulfilled之后，并不会 取消其他promise对象的执行。
Promise.race接受的是一个Promise对象数组，但是返回的确实最先完成Fulfilled 或者最先被Rejected的一个Promise的结果
下面我们来举个例子：

这里我们再复习一下Node当中事件循环的知识：

第一层循环：i为0时，异步触发了Promise.race().catch()，这里面的回调代码被放在了微任务队列中， 后面的3个setTimeout宏任务的回调函数代码被放进了timer阶段中的队列当中(其实并不是这样，因为 三个定时器都有延迟，都是在后面的事件循环中添加进来的)
第二层循环：清空微任务对列，所以控制台打印出了错误，然后清空宏任务，分别打印出3000/5000/7000
9. Promise.any
  Promise.any的入参和Promise.all、Promise.race、Promise.allSettled一样， 接收一个promise对象的数组作为参数。

只要其中有一个Promise成功执行，就会返回已经成功执行的Promise的结果
如果这个promise对象的数组中没有一个promise 可以成功执行（即所有的 promise都失败 ），就返回一个失败的promise 和AggregateError类型的实例，它是Error的一个子类，用于把单一的错误集合 在一起
 
var promise1 = new Promise((resoleve, reject) => {
  setTimeout(() => {
    // reject(new Error("promise1--3000"));
    resoleve("promise1--3000");
  }, 3000);
});
var promise2 = new Promise((resoleve, reject) => {
  setTimeout(() => {
    // reject(new Error("promise2--1000"))
    resoleve("promise1--1000");
  }, 1000);
});
var promise3 = new Promise((resoleve, reject) => {
  setTimeout(() => {
    // resoleve("promise3--5000");
    reject(new Error("promise1--5000"))
  }, 5000);
});
var promiseArr = [promise1, promise2, promise3];
console.time("promiseArr");
Promise.any(promiseArr)
  .then((res) => {
    console.log("res", res); // res promise1--1000
    console.timeEnd("promiseArr");
  })
  .catch((err) => console.error(err)); 
  //所有的Promise都失败， AggregateError: All promises were rejected

总计一下Promisea.any的应用场景：如果我们现在有多台服务器，则尽量使用响应速度最快的服务器，在这种情况下， 可以使用Promise.any()方法从最快的服务器接收响应。

文章知识点与官方知识档案匹配，可进一步学习相关知识
Vue入门技能树首页概览26322 人正在系统学习中

程序员啊楠
关注

142

238

53

专栏目录
- 为什么使用消息队列？ - 消息队列有什么优点和缺点？ - Kafka、ActiveMQ、RabbitMQ、RocketMQ
02-14
- 为什么使用消息队列？ - 消息队列有什么优点和缺点？ - Kafka、ActiveMQ、RabbitMQ、RocketMQ 都有什么区别，以及适合哪些场景？
instantclient-21-9
02-15
官网原版
评论53条写评论
Kingdomwangwh
热评
大佬太强了
Promise方法汇总_小白目的博客
2-10
(4)Promise方法:all() all()方法可以完成并行任务, 它接收一个数组,数组的每一项都是一个promise对象。当数组中所有的promise的状态都达到resolved的时候,all方法的状态就会变成resolved,如果有一个状态变成了rejected,那么all方法的状态就...
Promise的几个常用方法_不断学习的码农的博客_promise的...
2-3
该方法接收一个Promise数组返回一个Promise,只有当该数组中的所有Promise完成后才会由pendding状态变为resolve执行then里面的回调函数,若数组中有任意一个promise被拒绝则会执行失败回调,catch方法会捕获到首个被执行的 reject函数。该方法获得...
yang-liao-ge-yang-随机皮肤.exe
最新发布
02-15
yang-liao-ge-yang-随机皮肤.exe
openstack第8周视频教程.rar
02-14
openstack第8周视频教程.rar
Promise 的实例方法和静态方法有哪些,如何手动实现?
2-8
Promise.all()方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。所有参数数组 Promise 实例执行 resolve 回调后,新实例执行 resolve 回调;如果中间有任何一个 Promise 实例执行 reject 回调,那么新实例就直接执行 reject 回调了。
Promise的理解以及五种方法_旺仔小码农的博客
2-12
promise.then(function(value) { //success },function(error) { //failure }); then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为resolved时调用,第二个回调函数是Promise对象的状态变为rejected时调用。其...

node-v18.14.0-linux-x64.tar.xz
02-15
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时
AIGC发展趋势报告2023：迎接人工智能的下一个时代
02-14
2022年是AIGC (Al-Generated Content，人工智能生成内容〉爆火出圈的一年，不仅被消费者追捧，而且备受投资界关注，更是被技术和产业界竞相追逐。9月23日，红杉美国发表文章《生成式Al:一个创造性的新世界》，认为AIGC会代表新一轮范式转移的开始。2022年10月，Stability Al获得约1亿美元融资，估值高达10亿美元，跻身独角兽行列。Stability Al 发布的开源模型Stable Diffusion，可以根据用户输入的文字描述(称为提示词，prompts)自动生成图像，即文生图(Text-to-lmage，T2I)。Stable Diffusion、DALL-E 2、MidJourney等可以生成图片的AlGC模型引爆了AlI作画领域，Al作画风行一时，标志人工智能向艺术领域渗透。2022年12月, OpenAl的大型语言生成模型ChatGPT刷爆网络,它能胜任刷高情商对话、生成代码、构思剧本和小说等多个场景，将人机对话推向新的高度，让网友们不禁怀疑ChatGPT是否已经具有人类智能。全球各大科技企业都在积极拥抱AIGC，不断推出相关的技术、平台和
Promise简介原理和常见方法_观空自然的博客_promise原理
2-16
二、 promise用法 Promise是一个构造函数,自己身上有all、reject、resolve这几个眼熟的方法,原型上有then、catch等同样很眼熟的方法。 Promise的构造函数接收一个参数:函数,并且这个函数需要传入两个参数: ...
Promise常用方法_空口白话的博客
2-17
1、Promise.prototype.then(handleSuccess, handleFail)方法较为常用,两个参数为函数 2、handleSuccess和handleFail分别用于处理异步成功的情况和失败的情况,最后都会返回一个成功状态的Promise实例 ...
基于STM32的智能仓储系统
02-15
之前上物联网控制技术的时候，课程要求做的智能仓储。使用MQTT协议上云平台。然后进行警告和报警处理。以及云平台下发指令。 附赠部分演示视频：https://www.bilibili.com/video/BV1sB4y1m7Lg/?vd_source=bd8f37dbcfa78eb9a2851c0ec844f419#reply152380387760
网上物流管理信息系统-B/S-课设
02-14
系统配置： CPU:Inter P4 1.8以上 内存：512MB以上 硬盘：40G以上 软件环境：Windows 2003 Server (含IIS 6.0),Microsoft Sql Server 2000 Vs 2003 dremweaver mx 2004 fireworks mx 2004 结合.net的特性和物流信息系统的特点，系统采用B/S的结构模式开发。 (1)货物登记调动管理:对入库的货物进行登记(货物id、货物名称、货物厂家、货物价格、货物品牌、货物状态)录入到系统中,等待货物的调配运输。 (2)货物运输配送管理:把货物从库存中调度出来,进行分类选定,开始物流送货。 (3)货物单据查询验收:根据货物的发送时间和客户的确认时间以及货物的状态值(0和1)对货物在运输过程中进行监控并把单据信息及时返回到系统中。 (4)客户信息管理 系统在设计过程中不可避免地遇到了各种各样的问题，通过测试发现系统还存在如下的问题： 1、系统界面还不够友好。 2、信息的管理不够全面。 3、一些数据字段定义不够准确。 4、物流管理信息系统的一些功能，如数据备份和数据恢复等还没实现。
Promise常用使用方法总结_zhou13528482267的博客_工作中pro...
2-13
一、Promise基础使用如下: let myPromise=new Promise((resolve, reject)=>{ //当异步代码执行成功时,调用resolve();失败时,调用reject() //这里使用setTimeout(...)来模拟异步代码,实际编码时可能是ajax请求或是一些API方法 ...
STM32H750实现PWM输出【支持STM32H7系列单片机_寄存器库驱动】.zip
02-14
STM32H750驱动程序，寄存器库。 项目支持STM32H7系列单片机调测和移植。 项目代码可直接编译、运行。
BP神经网络matlab实例(简单而经典)
02-14
神经网络预测模型matlab BP神经网络matlab实例(简单而经典)
ARM c库编译启动以及初始化文档 《startup-code-for-arm-compiler.pdf》
02-15
详细介绍了ARM在进入__main()函数后，进入main()函数之前所做的一系列工作
基于Java的宠物管理系统源码实现sql数据库.rar
02-15
基于Java的宠物管理系统源码实现sql数据库（附带项目源码+sql数据库+毕业论文、答辩ppt等资料+项目截图） 本系统是采用Java技术来构建的一个基于Web技术的B/S结构的宠物网站，该网站建立在Spring和Struts2框架之上，前台使用JSP作为开发语言，后台使用MySQL数据库管理系统对数据进行管理，开发环境选用MyEclipse，应用服务器采用Tomcat。 系统主要分为前台和后台两大模块 一、前台主要由用户体验使用: 用户登录 注册 查找商品 商品类别等功能导航； 二、后台主要由系统管理员操作使用 维护系统 管理员主要实现了 订单管理 商品管理 公告管理 会员管理 用户管理 个人信息维护等主要功能 其中最为重要的5张数据表，将会在详细描述其表结构。 （1）开发硬件平台： CPU：酷睿双核 3.2GHZ 内存：4G以上 硬盘：320GB （2）服务器端硬件平台： Web服务器参考配置：Intel Xeon Quad Core E5530 80W 2.40GHz/5.8GT/8MB Ca
外协SMT审核代工厂审厂方法
02-15
如何的选择SMT代工厂，如何的找方案商资源，如何的谈判，注意把控的点。
STM32H750 EMWIN实现LISTVIEW小工具【支持STM32H7系列单片机_GUI设计】.zip
02-15
STM32H750 EMWIN GUI可视化实战。 项目支持STM32H7系列单片机调测和移植。 项目代码可直接编译、运行。
真题-1.zip
02-15
真题-1.zip
YOLO算法N95口罩检测数据集 N95-mask-dataset-yolo.zip
02-15
YOLO算法N95口罩检测数据集，txt和xml两种格式标签，分为戴N95口罩和未戴口罩两种类别
redis 的并发竞争问题是什么？如何解决这个问题？了解 redis 事务的 CAS 方案吗？
02-14
redis 的并发竞争问题是什么？如何解决这个问题？了解 redis 事务的 CAS 方案吗？
教育领域，综合文档，实用文档
02-14
教育领域，综合文档，实用文档
example.m
02-15
example.m

类型	指派人员	状态
审查	yutao zhanglutong zhangyao28 tan_yukun	已完成 (0/0人)
测试	yutao zhanglutong tan_yukun	已完成 (0/0人)

fhs_opensource/fhs-framework .gitee-modal { width: 500px !important; }

搜索帮助

fhs_opensource/fhs-framework