封装一个Promise.all 的函数
// 1. 准备三个异步函数
const promise1 = Promise.resolve('prom11ise1');
const promise2 = new Promise(function (resolve, reject) {
setTimeout(resolve, 2000, 'promise2');
});
const promise3 = new Promise(function (resolve, reject) {
setTimeout(resolve, 1000, 'promise3');
}); // 2. 封装PromiseAll函数 返回的结果是一个new Promise 信息是一个数组 data
const PromiseAll = (iterator) => {
// 对传入的数据进行浅拷贝,确保有遍历器 - 类数组转换真数组
const promises = Array.from(iterator);
const len = promises.length; // 长度 3
let index = 0; // 每次执行成功+1,当等于长度时,说明所有数据都返回,则可以resolve
let data = []; // 用来存放返回的数据数组
return new Promise((resolve, reject) => {
// 遍历逐个执行 Promise
for (let i in promises) {
promises[i]
.then((res) => {
data[i] = res; // 如果成功了就保存 message
// 先判断 是否全部都执行成功了 成功执行 resolve 并把 data 数组返回
// 如果没有全部执行 index+1
if (++index === len) {
resolve(data);
}
})
.catch((err) => {
reject(err); // 只要有一次error直接返回 reject
});
}
});
}; // 3. 调用
PromiseAll([promise1, promise2, promise3]).then(function(values) {
console.log(values); // 结果: ["prom11ise1", "promise2","promise3"]
});
Promise是一种抽象异步处理对象,参数值为一个回调函数。该回调函数又使用两个参数,参数值分别为两个回调函数(resolve,reject),如果执行成功则调用resolve回调函数,否则执行reject回调函数。
Promise.all介绍:promise.all(promises),promises参数是一个数组(iterable类型),数组内的元素都是promise对象,当里面的每一个promise对象都返回成功resolve的回调函数,它则返回包含数组内每一个元素信息的成功回调函数(resolve),当数组内有一个或以上promise对象返回失败的回调函数,则最后也会返回调用失败的回调函数(reject)。
ps:Array,Map,Set都属于ES6的iterable类型。
封装一个Promise.all 的函数的更多相关文章
- JS 封装一个显示时间的函数
s(); function s (){ var mydate=new Date(); var y = mydate.getFullYear(); var m = mydate.getMonth(); ...
- JS 封装一个求圆面积的函数 传值:半径
y(6) var s = ""; function y (r){ s = Math.PI*r*r; alert(s); }
- Node.js用ES6原生Promise对异步函数进行封装
Promise的概念 Promise 对象用于异步(asynchronous)计算..一个Promise对象代表着一个还未完成,但预期将来会完成的操作. Promise的几种状态: pending:初 ...
- 封装一个Ajax工具函数
/*封装一个ajax工具函数*/ window.$ = {}; /*通过$定义一个ajax函数*/ /* * 1. type string 请求的方式 默认是get * 2. url ...
- promise对象的回调函数resolve的参数为另一个promise对象
/*如果调用resolve函数和reject函数时带有参数,那么它们的参数会被传递给回调函数. reject函数的参数通常是Error对象的实例,表示抛出的错误: resolve函数的参数除了正常的值 ...
- js数据类型的检测总结,附面试题--封装一个函数,输入任意,输出他的类型
一.javascript 中有几种类型的值 1.基本数据类型 : 包括 Undefined.Null.Boolean.Number.String.Symbol (ES6 新增,表示独一无二的值) 特点 ...
- 自己封装一个readline函数实现服务器客户端回射
实现的功能:一次只能读取一行,客户端输入之后,一回车,马上字符串传到服务器端并显示在终端,然后服务器端将字符串又传回给客户端. 服务器端可以接收多个客户端的连接请求,并fork一个子进程来进行服务. ...
- JavaScript封装一个函数效果类似内置方法concat()
JavaScript封装一个函数效果类似内置方法concat() 首先回忆concat()的作用: concat() 方法用于连接两个或多个数组.该方法不会改变现有的数组,而仅仅会返回被连接数组的一个 ...
- 前端笔记之ES678&Webpack&Babel(下)AMD|CMD规范&模块&webpack&Promise对象&Generator函数
一.AMD和CMD规范(了解) 1.1传统的前端开发多个js文件的关系 yuan.js中定义了一个函数 function mianji(r){ return 3.14 * r * r } main.j ...
- 代码改变世界 | 如何封装一个简单的 Koa
下面给大家带来:封装一个简单的 Koa Koa 是基于 Node.js 平台的下一代 web 开发框架 Koa 是一个新的 web 框架,可以快速而愉快地编写服务端应用程序,本文将跟大家一起学习:封装 ...
随机推荐
- vue里使用px2rem
安装 yarn add postcss-px2rem 配置 在vue.config.js中添加以下配置 const px2rem = require('postcss-px2rem') module. ...
- 【Vue】01 基础语法
Hello Vue的演示案例: <!DOCTYPE html> <html lang="en" xmlns:v-bind="http://www.w3. ...
- 深度学习框架theano下的batch_norm实现代码——强化学习框架rllab
深度学习框架theano下的batch_norm实现代码--强化学习框架rllab # encoding: utf-8 import lasagne.layers as L import lasagn ...
- 如何查看华为的大模型(AI模型),华为官方的mindspore下的大模型???
由于华为官方的mindspore网站的设计比较反人性话,操作起来十分的复杂,因此如果想要在华为的官方网站上查找这个华为的官方大模型还是比较困难的,为此直接给出链接地址. PS. 要注意,华为的AI官方 ...
- python语言绘图:绘制一组二项分布图
代码源自: https://github.com/PacktPublishing/Bayesian-Analysis-with-Python ============================= ...
- 23 暑假友谊赛 No.4(UKIEPC 2017)
23 暑假友谊赛 No.4(UKIEPC 2017) Problem A Alien Sunset hh,开始一眼差分,但是写寄了qwq,后来换枚举过了(Orz,但是看学长差分是能做的,我就说嘛,差分 ...
- 【问答23】Linux移植:如何制作rootfs?
粉丝问题 如何制作rootfs? 安排! 想直奔主题的,直接跳到第四章. 一.分析 1. 文件系统简介 理论上说一个嵌入式设备如果内核能够运行起来,且不需要运行用户进程的话,是不需要文件系统的,文件系 ...
- Elsa V3学习之Hello Word
前面文章介绍了Elsa的基础节点内容,接下来我们来开始实践一下. 启动项目 启动源码目录src\bundles中的Elsa.ServerAndStudio.Web的项目.这个项目包含Elsa Serv ...
- Viper:强大的Go配置解析库
1 介绍 Viper是适用于Go应用程序的完整配置解决方案.它被设计用于在应用程序中工作,并且可以处理所有类型的配置需求和格式.目前Star 26.6k, 它支持以下特性: 设置默认值 从JSON.T ...
- JavaScript设计模式样例十五 —— 状态模式
状态模式(State Pattern) 定义:创建表示各种状态的对象和一个行为随着状态对象改变而改变的 context 对象.目的:允许对象在内部状态发生改变时改变它的行为,对象看起来好像修改了它的类 ...