当前位置: 首页 > ds >正文

JS手写代码篇---手写promise.all

5、promise.all

首先promise.all的作用:

all主要用来解决多个异步操作的调用问题,类似于Promise.all的功能。

        function p1 (){return new Promise((resolve , reject) => {setTimeout(() => {resolve('p1 resolved');}, 1000);})}function p2 (){return new Promise((resolve , reject) => {resolve('p2 resolved');})}Promise.all([p1(), p2()]).then((results) => {console.log(results); // ['p1 resolved', 'p2 resolved']}).catch((error) => {console.error(error);});

因为p1是有setTimeout的,所以p1会在1秒后执行,而p2是立即执行的,所以p1和p2的结果会在1秒后一起输出。但是我们使用了 Promise.all,所以它会等待所有的 Promise 都完成后再执行 then 方法。这就是为什么结果是 [‘p1 resolved’, ‘p2 resolved’],而不是 [‘p2 resolved’, ‘p1 resolved’]。

开始手写:

  • all方法是静态方法,所以不需要实例化
  • all方法的返回值是一个新的promise对象,这个新的promise对象的结果是一个数组,数组的长度和传入的数组长度一致
  • 如果有一个失败,就直接reject
  • 如果所有的都成功,就resolve一个数组,数组的长度和传入的数组长度一致
  • for循环一下子就执行完了,但是有异步执行的操作,我们要设一个计数器,当数组的长度和传入的数组长度一致的时候,就要reject
        static all(array){let res = []; //存放结果的数组let count = 0; // 计数器return new Commitment((resolve , reject) => {// 添加数据的函数function addData (key , value){res[key] = value;count++; // 每添加一个数据就加1// 如果计数器等于数组长度,就说明所有数据都添加完了if(count === array.length){// 说明所有数据都添加完了,就resolveresolve(res);//保证所有数据都添加完了才resolve,因为for循环一下子就执行完了,但是有异步执行的操作}}// 循环for(let i = 0 ; i < array.length ; i++){let cur = array[i];// 判断是否是普通值if(cur instanceof Commitment){// 如果不是,执行promise,注意如果有一个失败,就直接rejectcur.then((value) => addData(i , value) , (error) => reject(error));}else {// 如果是,直接添加到结果数组中addData(i , cur);}}})}

总结一下:promise.all方法主要是处理多个异步的调用问题,传入一个数组,返回的是新的promise对象,它是静态方式。所以传入数组后我们循环遍历了这个数组,如果它是普通值,如果是就要直接添加到结果数组里卖弄,如果不是,then等待结果,只要有一个错误,那么就直接reject,最后当结果数组的长度和传入数组的长度相同的时候就要resolve啦~~

http://www.xdnf.cn/news/9348.html

相关文章:

  • Python条件语句完全指南:从if-else到模式匹配
  • 鸿蒙OSUniApp 实现带搜索功能的下拉菜单#三方框架 #Uniapp
  • 实验设计与分析(第6版,Montgomery)第3章单因子实验:方差分析3.11思考题3.1 R语言解题
  • PIO 也有并发喔,巧用SIDE-SET
  • 解决Qt 打包的软件缺少dll问题
  • 《计算机组成原理》第 4 章 - 存储器​
  • 零基础设计模式——结构型模式 - 装饰器模式
  • 国芯思辰| 同步降压转换器CN2020应用于智能电视,替换LMR33620
  • 在ubuntu手动分区时,730GB的总空间,建议划分多少给根目录
  • AI应用 Markdown 渲染对比与原生实现方案
  • 书籍品读:《逆水行舟话幸福》(陈州)
  • 【Python】2. 基础语法(2)
  • 【运维_日常报错解决方案_docker系列】一、docker系统不起来
  • 从自动化到智能化:制造业数字化转型的五个关键跃迁
  • Vue-03 (调试工具Vue Devtools )
  • delphi xe 12.3下解决错误 ld.exe: unrecognized option ‘--no-rosegment‘
  • 试验台铁地板:技术创新与品质保障
  • 【观成科技】Ymir勒索软件组织窃密木马RustyStealer加密通信分析
  • STM32的HAL编码流程总结(上部)
  • 大模型——MCP 深度解析
  • vue2使用element中多选组件el-checkbox-group,数据与UI更新不同步
  • 【React】jsx 从声明式语法变成命令式语法
  • 5G NTN卫星通信发展现状(截止2025年3月)
  • 每日算法-250527
  • SNTP 协议详解:网络时间同步的轻量级解决方案
  • Python os 模块简介及基础使用示例
  • 如何撰写一篇优质 Python 相关的技术文档 进阶指南
  • Cmake编译yaml-cpp并在QT中测试成功操作步骤
  • AI情感陪伴在医疗领域的核心应用潜力
  • 打卡37天