百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT知识 > 正文

一次搞懂 Promise 异步处理(promise怎么处理异步)

liuian 2025-03-25 15:21 56 浏览

Promise

Promise 就像这个词的表面意识一样,表示一种承诺、许诺,会在后面给出一个结果,成功 或者 失败。现在已经成为了主流的异步编程的操作方式,写进了标准里面。

状态

Promise 有且仅有三种状态:

  • 待定(pending): 初始状态,既没有被兑现,也没有被拒绝。
  • 已兑现(fulfilled): 意味着操作成功完成。
  • 已拒绝(rejected): 意味着操作失败。

其实我觉得这个模型还是挺简单,也很好理解。就好像,你跟你女朋友求婚,她跟你说她要考虑一下,明天才能给你答案,这就是承诺(promise)。同时,这也是一个等待的过程(pending),然后你就等,等到明天你女朋友给你答复,同意(fulfilled)或者拒绝(rejected),如果同意就准备结婚了,如果不同意就等下次再求婚,哈哈哈。

那状态要怎么改变呢?

Promise 的构造函数需要传入一个函数 executor ,这个函数需要两个入参分别是 resolverejected 两个函数,这两个方法主要是用来修改状态的。当我们调用 resolve 函数的时候,Promise 的状态就变成 fulfilled 。当我们调用 reject 函数的时候,Promise 的状态就变成 reject 。举个栗子:

new Promise((resolve, reject) => {
    console.log("开始求婚。")
    console.log("。。。。。")
    console.log("考虑一下。")
    setTimeout(() => {
        if (isHandsome || isRich) {
            resolve('我同意!')
        } else {
            reject("拒绝:我们八字不合")
        }
    }, 2000)
})

这里还要注意一点,如果一个 promise 已经被兑现(fulfilled)或被拒绝(rejected),那么我们也可以说它处于已敲定(settled)状态。

链式调用

这点跟 Rx 还是挺相似的,也是链式调用,这样的好处就是异步逻辑更加清晰,连贯,符合直觉,避免了回调地狱。

我们可以用 Promise.then(),Promise.catch() 和 Promise.finally() 这些方法将进一步的操作与一个变为已敲定状态的 Promise 关联起来。这些方法还会返回一个新生成的 Promise 对象,这个对象可以被非强制性的用来做链式调用,就像这样:

const myPromise =
  (new Promise(myExecutorFunc))
  .then(handleFulfilledA,handleRejectedA)
  .then(handleFulfilledB,handleRejectedB)
  .then(handleFulfilledC,handleRejectedC);

// 或者,这样可能会更好...

const myPromise =
  (new Promise(myExecutorFunc))
  .then(handleFulfilledA)
  .then(handleFulfilledB)
  .then(handleFulfilledC)
  .catch(handleRejectedAny);

我们一般推荐使用第二种的写法,因为第一种写法如果在中间出错,在 .then 中处理完之后,会继续走下一个 .then 的 onfulfilled 函数,不太符合直觉。当然,如果你有马上处理异常的需求也可以这样写。

当 .then() 中缺少能够返回 Promise 对象的函数时,链式调用就直接继续进行下一环操作。因此,链式调用可以在最后一个 .catch() 之前把所有的 handleRejection 都省略掉。类似地, .catch() 其实只是没有给 handleFulfilled 预留参数位置的 .then() 而已。

还是一个 Promise

这里要特别注意一个点,Promise.then() 、Promise.catch()、Promise.finally() 这些方法会返回一个新的 Promise,这一点在其他很多文章中会忽略这个点。 .then() 函数最后会返回一个 Promise ,如果在 .then 的 onfulfilled (也就是入参的第一个函数)中返回一个值,或者对象,这个 Promise 的状态就会确定(settled),接着会触发下个 .then() 中的 onfulfilled ,并将这个 值 或者 对象作为入参传入。

诶,等一下,如果在 .then() 中直接返回一个 Promise 呢?

这个时候就会直接替换返回的 Promise 。就跟 RxJava 中的 flatMap 操作挺相似的。MDN 中有说明:

链式调用中的 promise 们就像俄罗斯套娃一样,是嵌套起来的,但又像是一个栈,每个都必须从顶端被弹出。链式调用中的第一个 promise 是嵌套最深的一个,也将是第一个被弹出的。

(promise D, (promise C, (promise B, (promise A) ) ) )

当存在一个 nextValue 是 promise 时,就会出现一种动态的替换效果。return 会导致一个 promise 被弹出,但这个 nextValue promise 则会被推入被弹出 promise 原来的位置。对于上面所示的嵌套场景,假设与 "promise B" 相关的 .then() 返回了一个值为 "promise X" 的 nextValue 。那么嵌套的结果看起来就会是这样:

(promise D, (promise C, (promise X) ) )

观察者模式?

而且一个 Promise 可能会参与不止一次的嵌套,感觉也像是观察者的模式,并支持多个观察者。对于下面的代码,promiseA 向"已敲定"("settled")状态的过渡会导致两个实例的 .then 都被调用。

const promiseA = new Promise(myExecutorFunc);
const promiseB = promiseA.then(handleFulfilled1, handleRejected1);
const promiseC = promiseA.then(handleFulfilled2, handleRejected2); 

写点代码

讲了这么多,写点代码吧,就写一个,女朋友多次拒绝之后看到了你的诚意,最后同意的故事。手动狗头。

let count = 0

const propose = () => {
    return new Promise((resolve, reject) => {
        console.log("开始求婚。")
        console.log("。。。。。")
        console.log("考虑一下。")
        setTimeout(() => {
            if (count < 3 reject count else resolve 2000 const startpropose='()'> {
    propose()
        .then((result) => {
            console.log(result)
            console.log("完结撒花")
            console.log("、·、·、、·、·、·、")
        },)
        .catch((e) => {
            {
                console.error(e)
                console.log("被拒绝了,下次再求婚。")
                setTimeout(() => {
                    startPropose()
                }, 3000)
            }
        })
}

startPropose()

补充:

还有一些小细节。

  1. Promise 一旦创建,传入的 executor 会被立刻执行。
  2. 一个“已敲定”("settled")状态的 Promise 也可以接受操作,也就是说,后面可以接 then 或者 catch 函数。
  3. 所有 Promise 都是异步的,即便是“已敲定”(“settled”)了的 Promise 也是如此。一个已经处于"已敲定"("settled")状态的 promise 中的操作只有 promise 链式调用的栈被清空了和一个事件循环过去了之后才会被执行。这种效果跟 setTimeout(action, 10) 特别相似。 const promiseA = new Promise( (resolutionFunc,rejectionFunc) => { resolutionFunc(777); }); // 这时,"promiseA" 已经被敲定了。 promiseA.then( (val) => console.log("asynchronous logging has val:",val) ); console.log("immediate logging"); // produces output in this order: // immediate logging // asynchronous logging has val: 777
  4. 其他一些静态方法 Promise.all(iterable) 这个方法返回一个新的promise对象,该promise对象在iterable参数对象里所有的promise对象都成功的时候才会触发成功,一旦有任何一个iterable里面的promise对象失败则立即触发该promise对象的失败。这个新的promise对象在触发成功状态以后,会把一个包含iterable里所有promise返回值的数组作为成功回调的返回值,顺序跟iterable的顺序保持一致;如果这个新的promise对象触发了失败状态,它会把iterable里第一个触发失败的promise对象的错误信息作为它的失败错误信息。Promise.all方法常被用于处理多个promise对象的状态集合。(可以参考jQuery.when方法---译者注) Promise.allSettled(iterable) 等到所有promises都已敲定(settled)(每个promise都已兑现(fulfilled)或已拒绝(rejected))。 返回一个promise,该promise在所有promise完成后完成。并带有一个对象数组,每个对象对应每个promise的结果。 Promise.any(iterable) 接收一个Promise对象的集合,当其中的一个 promise 成功,就返回那个成功的promise的值。 Promise.race(iterable) 当iterable参数里的任意一个子promise被成功或失败后,父promise马上也会用子promise的成功返回值或失败详情作为参数调用父promise绑定的相应句柄,并返回该promise对象。 Promise.reject(reason) 返回一个状态为失败的Promise对象,并将给定的失败信息传递给对应的处理方法 Promise.resolve(value) 返回一个状态由给定value决定的Promise对象。如果该值是thenable(即,带有then方法的对象),返回的Promise对象的最终状态由then方法执行决定;否则的话(该value为空,基本类型或者不带then方法的对象),返回的Promise对象状态为fulfilled,并且将该value传递给对应的then方法。通常而言,如果您不知道一个值是否是Promise对象,使用Promise.resolve(value) 来返回一个Promise对象,这样就能将该value以Promise对象形式使用。

参考:MDN(
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise)

相关推荐

ios是什么意思手机(苹果手机ios是啥意思)

对的,ios是苹果手机搭载的系统,但是不仅仅是应用在iphone手机哦,在苹果台式电脑、笔记本电脑、平板电脑以及苹果其它设备都是搭载的ios系统。它是苹果公司开发的独立且封闭性的操作系统,不对外公开,...

什么网站可以免费下载电影(在哪个网站下载电影免费)

1.ITunesMovieTrailers苹果的预告片库,库中影片的画质都很不错,基本上覆盖了当前的主流电影,以美国电影居多,国内的片子比较少,如果需要从中下载,那么下载时需要配合浏览器的资源嗅探...

怎样下载word文档(如何免费使用word文档)
  • 怎样下载word文档(如何免费使用word文档)
  • 怎样下载word文档(如何免费使用word文档)
  • 怎样下载word文档(如何免费使用word文档)
  • 怎样下载word文档(如何免费使用word文档)
破解版手游下载平台(破解版手游下载平台app)

我很抱歉,我不能提供给您任何非法下载的方式。迷失的女孩是一款由MaximTheRobotLLC开发的游戏,与其他的游戏一样,版权被保护。如果您想下载该游戏,请在官方应用商店(如GooglePl...

两个路由器无线桥接怎么设置

两台路由器无线桥接方法如下1.两个路由器桥接,首先第一步就是要设置主路由器,一根网线连上路由器的WAN口和猫相连,而另一根网线从路由起插口的1,2,3,4,口出来连上电脑。之后打开电脑浏览器输入19...

win11资源管理器(win11资源管理器崩溃)

出现此问题可以参考如下解决方法:1.我们先打开windows文件资源管理器窗口,可以看到在设备和驱动器列表中没有显示出磁盘的盘符2.这时我们点击菜单栏的查看菜单3.接着在打开的查看工具栏点击选项的图标...

可以偷偷加回误删的qq好友吗

2021年删除好友偷偷加回来,对方知道吗?如果说2021年你把你的好友删除了,但是你要把他偷偷的加回来的话,那对方是肯定会知道的,因为你在家的时候要对方同意你才能加得到,如果对方不同意的话,那你肯定是...

电脑怎么强制恢复出厂设置win10
  • 电脑怎么强制恢复出厂设置win10
  • 电脑怎么强制恢复出厂设置win10
  • 电脑怎么强制恢复出厂设置win10
  • 电脑怎么强制恢复出厂设置win10
磊科无线路由器手机设置(用手机 怎么设置磊科路由器怎么设置密码)

  刚要回答你磊科无线路由器怎么设置无线网络这个大问题,看后面估计你更想知道的不是磊科无线路由器怎么设置无线网络,而是怎么用手机设置网络吧,其实很简单的,我刚才还用手机设置我刚买的极贰的网络  手机只...

萝卜家园xp系统安装(萝卜家园xp系统安装步骤及图片)

先用大白菜制作u盘启动项。再下载萝卜家园系统,放到u盘。开机选择用u盘启动,进入pe,打开ghost加载系统执行安装。

台式电脑显卡安装步骤图(台式机显卡怎么安装图解)

关于这个问题,1.确认电脑是否支持显卡首先,要确认电脑是否支持显卡。如果是台式机,需要确认主板是否支持PCI-E插槽;如果是笔记本电脑,则需要确认是否有可更换显卡的插槽。2.卸下原有显卡如果你的电...

win11免费下载(win11正式版下载)
  • win11免费下载(win11正式版下载)
  • win11免费下载(win11正式版下载)
  • win11免费下载(win11正式版下载)
  • win11免费下载(win11正式版下载)
虚拟光驱推荐(虚拟光驱推荐知乎)

虚拟光驱是一种计算机软件,用于模拟物理光驱的功能。它可以将光盘的内容转化为电脑上的虚拟光盘,用户可以在计算机上直接使用虚拟光盘中的文件和程序,而无需实际插入光盘。虚拟光驱的主要功能包括:1.安装软件...

win7和win10互联(win7和win10可以网络共享吗)

一台电脑只要已经使用过一次已经激活的win10,以后可以随便重装win10,都会自动激活。不限制次数,只要你不把这台电脑的主板给换掉即可。所以可以随时重装,或者也可以使用win7、win8.1的密钥...

电脑给另一个硬盘装系统(电脑给另一块硬盘装系统)

回答如下:以下是在Windows操作系统下的步骤:1.确保你有一个可用的Windows安装光盘或USB安装介质。2.将另一个硬盘连接到计算机上并确保电脑识别到它。3.打开计算机BIOS并确保在启...