「这是我参与11月更文挑战的第 3 天,活动详情查看:2021最后一次更文挑战」
这是我为
Promise系列精心准备的文章
组合期约
Promise.all()
接收一个可迭代的对象 通常我们会传递一个数组,这个迭代元素中的单个对象,通常为 new 创建的 Promise 对象
或者,这个数组中,我们直接传递具体值,如图示:
里面的数据,实际上会被包装为 Promise.resolve 对象进行返回,而这,也没必要使用 Promise.all,直接在同步代码块编写即可
Promise.all 最常用于,异步加载多个并不相关的数据,而回调函数需要等这些异步数据 全部就绪 才会执行
举一个场景,后台设计 api 接口返回时,使用 id 替代嵌套对象,而这些嵌套对象的数据,已经有现成的接口,我们在不需要修改后台接口的情况下,直接拉取这些副本数据,在页面上完成对象嵌套的功能,再去执行我们自己的业务
正常情况下, Promise.all 需要等待自己数组参数里的全部 Promise 变为解决状态后,会将他们解决方法中传递的数据,按照在 all() 中参数传递的顺序,处理为一个数组对象,并包装为 Promise.resolve 返回,说的可能有点绕,看下图就会理解:
但是,若数组里的 Promise 对象中,一旦出现了一个被拒绝的期约, Promise.all 会将这个期约拒绝的理由包装为 Promise.reject 进行返回。
注意点,即便出现了拒绝的期约,数组里的其他正常执行的期约,仍会照旧运行!!! 以图为证
① 处立即执行,1s 后 ② 这里返回被拒的期约,all 方法此刻包装被拒的期约的理由并已经返回!!但 ③ 这里,在 2s 后仍有输出
Promise.race()
race 方法会返回第一个已经被处理的期约,无论这个期约是已解决,亦或被拒绝。
接收参数与 all() 相同,常规为期约的数组对象
Promise.any()
any 方法算是新版特性,不久前才被浏览器支持,使用时需慎重。接收参数与 all() 一致
当参数中的第一个期约 被解决 时,会将解决的结果包装为 Promise.resolve 返回
他的最佳用途为,当我们请求一项资源时,有好几个备选的渠道,我们在第一个期约成功拉取到资源后,即可立马开始做回调处理
原创文章,未经允许,禁止转载
-- by 安逸的咸鱼