如何使用 js 实现一个 Promise.all 方法 PromiseAll
如何使用 js 实现一个 Promise.all 方法 PromiseAll
Promise.all
PromiseAll
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-08-0
* @modified
*
* @description
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
* @solutions
*
*/
const log = console.log;
const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
setTimeout(resolve, 0, 'foo');
});
const promise4 = new Promise((resolve, reject) => {
reject(`promise error`);
});
const promisesOK = [promise1, promise2, promise3];
const promisesError = [promise1, promise2, promise3, promise4];
const OK = Promise.all(promisesOK).then((values) => {
log(`promisesOK values =`, values);
});
const Error = Promise.all(promisesError).then((values) => {
log(`promisesError values =`, values);
}).catch(err => {
log(`error =`, err)
});
setTimeout(() => {
log(`\nOK =`, OK)
log(`Error =`, Error)
}, 5);
/*
$ node promise.all.js
error = promise error
promisesOK values = [ 3, 42, 'foo' ]
OK = Promise { undefined }
Error = Promise { undefined }
*/
原理分析
Promise.resolve, Promise.reject
// Promise,不许需要用 Promise 包裹,但为了对齐也使用 Promise 包裹
promise1 = Promise.resolve(3);
// Promise {<fulfilled>: 3}
// 未使用 Promise 包裹
promise1.then(v => console.log(v))
// 3
// Promise {<fulfilled>: undefined}
// 使用 Promise 包裹
Promise.resolve(promise1).then(v => console.log(v))
// 3
// Promise {<fulfilled>: undefined}
// 非 Promise,需要用 Promise 包裹
promise2 = 42;
// 42
// 未使用 Promise 包裹
promise2.then(v => console.log(v))
// Uncaught TypeError: promise2.then is not a function
// 使用 Promise 包裹
Promise.resolve(promise2).then(v => console.log(v))
// 42
// Promise {<fulfilled>: undefined}
// 异常 promise
promise4 = new Promise((resolve, reject) => {
reject(`promise error`);
});
// Promise {<rejected>: "promise error"}
// 未使用 catch 处理
Promise.resolve(promise4).then(v => console.log(v))
// Promise {<rejected>: "promise error"}
// Uncaught (in promise) promise error Promise.then (async)
// 使用 catch 处理
Promise.resolve(promise4).then(v => console.log(v)).catch(err => console.log(`OK`))
// OK
// Promise {<fulfilled>: undefined}
// Promise.resolve, Promise.reject
solution
PromiseAll
// --unhandled-rejections=strict bug
/*
Unhandled promise rejection.
This error originated either by throwing inside of an async function without a catch block,
or by rejecting a promise which was not handled with .catch().
To terminate the node process on unhandled promise rejection,
use the CLI flag `--unhandled-rejections=strict`,
see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode
*/
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-08-14
* @modified
*
* @description PromiseAll
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
* @solutions
*
*/
const log = console.log;
const PromiseAll = (promises = []) => {
return new Promise((resolve, reject) => {
let count = 0;
const result = [];
try {
promises.forEach((promise) => {
Promise.resolve(promise).then(value => {
if(value) {
count += 1;
result.push(value)
}
}).catch(err => {
throw new Error(err);
});
});
if(count === promises.length) {
log(`PromiseAll OK`)
return resolve(result)
}
} catch (error) {
log(`Promise Error`, error)
throw new Error(error);
// return reject(error);
}
}).catch(err => {
log(`Promise Error`, err)
return reject(error);
});
}
https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-08-14
* @modified
*
* @description PromiseAll
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
* @solutions
*
*/
const log = console.log;
const PromiseAll = (promises = []) => {
let count = 0;
const result = [];
return new Promise((resolve, reject) => {
promises.forEach((promise) => {
Promise.resolve(promise).then(value => {
if(value) {
result[count] = value;
count += 1;
// result.push(value)
}
if(count === promises.length) {
// log(`PromiseAll OK`, promises)
resolve(result)
}
// if(result.length === promises.length) {
// // log(`PromiseAll OK`, promises)
// resolve(result)
// }
}, err => {
reject(err);
});
});
});
}
// test
const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 0, 'foo');
});
const promise3 = 42;
// const promise2 = 42;
// const promise3 = new Promise((resolve, reject) => {
// setTimeout(resolve, 0, 'foo');
// });
const promise4 = new Promise((resolve, reject) => {
reject(`promise error`);
});
const promisesOK = [promise1, promise2, promise3];
const promisesError = [promise1, promise2, promise3, promise4];
const OK = PromiseAll(promisesOK).then((values) => {
log(`promisesOK values =`, values);
});
// const OK = Promise.all(promisesOK).then((values) => {
// log(`promisesOK values =`, values);
// });
const Error = PromiseAll(promisesError).then((values) => {
log(`promisesError values =`, values);
}).catch(err => {
log(`catch error =`, err)
});
// const Error = Promise.all(promisesError).then((values) => {
// log(`promisesError values =`, values);
// }).catch(err => {
// log(`error =`, err)
// });
setTimeout(() => {
log(`\nOK =`, OK)
log(`Error =`, Error)
}, 5);
/*
$ node promiseAll.js
error = promise error
promisesOK values = [ 3, 42, 'foo' ]
OK = Promise { undefined }
Error = Promise { undefined }
*/
/*
$ node PromiseAll.js
catch error = promise error
promisesOK values = [ 3, 42, 'foo' ]
OK = Promise { undefined }
*/
PromiseAll OK
async promise order OK
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-08-14
* @modified
*
* @description PromiseAll
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
* @solutions
*
*/
const log = console.log;
const PromiseAll = (promises = [], debug = false) => {
const result = [];
return new Promise((resolve, reject) => {
promises.forEach((promise, i) => {
Promise.resolve(promise).then(value => {
if(value) {
// async promise order OK
result[i] = value;
// async push order bug
// result.push(value)
}
if(result.length === promises.length) {
if(debug) {
log(`PromiseAll OK`, promises)
}
resolve(result)
}
}, err => {
reject(err);
});
});
});
}
// test
const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 0, 'foo');
});
const promise3 = 42;
// const promise2 = 42;
// const promise3 = new Promise((resolve, reject) => {
// setTimeout(resolve, 0, 'foo');
// });
const promise4 = new Promise((resolve, reject) => {
reject(`promise error`);
});
const promisesOK = [promise1, promise2, promise3];
const promisesError = [promise1, promise2, promise3, promise4];
const OK = PromiseAll(promisesOK).then((values) => {
log(`promisesOK values =`, values);
});
// const OK = Promise.all(promisesOK).then((values) => {
// log(`promisesOK values =`, values);
// });
const Error = PromiseAll(promisesError).then((values) => {
log(`promisesError values =`, values);
}).catch(err => {
log(`catch error =`, err)
});
// const Error = Promise.all(promisesError).then((values) => {
// log(`promisesError values =`, values);
// }).catch(err => {
// log(`error =`, err)
// });
setTimeout(() => {
log(`\nOK =`, OK)
log(`Error =`, Error)
}, 5);
/*
$ node PromiseAll.js
catch error = promise error
promisesOK values = [ 3, 'foo', 42 ]
OK = Promise { undefined }
*/
/*
$ node promise.all.js
error = promise error
promisesOK values = [ 3, 'foo', 42 ]
OK = Promise { undefined }
Error = Promise { undefined }
*/
refs
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise
Promise
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
如何使用 js 实现一个 Promise.all 方法 PromiseAll的更多相关文章
- 实现一个promise.all方法
思路: 1:首先明白all的用法 2:promise.all可以接受一个由promise数组作为参数,并且返回一个promise实例, 3:promise.all([a,b,c...]).then方法 ...
- 实现一个Promise.all
用js自己实现一个Promise.all let promiseAll = (promises) => { return new Promise((resolve, reject) => ...
- js回调地域 和 用promise解决方法
回调地狱: function3({cb3()}){ function2({cb2(cb3)}){ //cb2触发了cb3,并传值 function1({cb1(cb2)}){ //cb1触发了cb2, ...
- 如何用原生JS实现一个简单的promise
我又又又回来了,最近真是累的跟狗一样,急需一个大保健回复一下子精力 我现在是一边喝着红牛一边写着博客,好了好了,不扯了,回归整体好吧 先简单来说一下啥是promise吧 它是什么?Promise是一个 ...
- js 将一个数组插入到另一个数组的方法
JavaScript将一个数组插入到另一个数组的方法.分享给大家供大家参考.具体分析如下: 1.通过Array.prototype.push.apply方法将一个数组插入到另外一个数组,下面的代码将数 ...
- 使用node.js 文档里的方法写一个web服务器
刚刚看了node.js文档里的一个小例子,就是用 node.js 写一个web服务器的小例子 上代码 (*^▽^*) //helloworld.js// 使用node.js写一个服务器 const h ...
- 教你一步一步实现一个Promise
Promise我想现在大家都非常熟悉了,主要作用就是解决异步回调问题,这里简单介绍下. Promise规范是CommonJS规范之一,而Promise规范又分了好多种,比如 Promises/A.Pr ...
- Promise原理—一步一步实现一个Promise
promise特点 一个promise的当前状态只能是pending.fulfilled和rejected三种之一.状态改变只能是pending到fulfilled或者pending到rejected ...
- Promise原理讲解 && 实现一个Promise对象 (遵循Promise/A+规范)
1.什么是Promise? Promise是JS异步编程中的重要概念,异步抽象处理对象,是目前比较流行Javascript异步编程解决方案之一 2.对于几种常见异步编程方案 回调函数 事件监听 发布/ ...
随机推荐
- .NET 中依赖注入组件 Autofac 的性能漫聊
Autofac 是一款超赞的 .NET IoC 容器 ,在众多性能测评中,它也是表现最优秀的一个.它管理类之间的依赖关系, 从而使 应用在规模及复杂性增长的情况下依然可以轻易地修改.它的实现方式是将常 ...
- Linux下nf_conntrack(最全面)_董明磊-CSDN博客_nf_conntrack https://blog.csdn.net/qq_35299863/article/details/79530732
Linux下nf_conntrack(最全面)_董明磊-CSDN博客_nf_conntrack https://blog.csdn.net/qq_35299863/article/details/79 ...
- (003)每日SQL学习:普通视图和物化视图
关于这一点一直就是很懵懂的状态,今天特意网上查了一下资料,以下摘抄网上比较好的答案.以作记录. 普通视图和物化视图的区别答曰:普通视图和物化视图根本就不是一个东西,说区别都是硬拼到一起的,首先明白基本 ...
- Java 字符串简介
从概念上讲,Java 字符串就是 Unicode 字符序列.Java 没有内置的字符串类型,而是在标准 Java 类库中提供了一个预定义类,很自然地叫做 String.每个用双引号括起来的字符串都是 ...
- QT串口助手(四):数据发送
作者:zzssdd2 E-mail:zzssdd2@foxmail.com 一.前言 开发环境:Qt5.12.10 + MinGW 实现的功能 串口数据的发送 ascii字符与hex字符的相互转换 自 ...
- Docker容器内中文乱码
Docker容器内中文乱码 一.通过Dockerfile解决中文乱码问题 方式二: 二.临时解决 方式二: 三.修改jre/lib/fonts下的字体 CSDN:黑猫_:Dockerfile 创建容器 ...
- java实现hbase数据库的增删改查操作(新API)
操作环境: java版本: jdk 1.7以上 hbase 版本:1.2.x hadoop版本:2.6.0以上 实现功能: 1,创建指定表 2,删除指定表 3,根据表名,行键,列族,列描述符,值 ...
- js打开新窗口并且居中显示
function openwindow(url,name,iWidth,iHeight) { var url; //转向网页的地址; var name; //网页名称,可为空; var iWidth; ...
- 4. Linux工作目录切换和文本文件编辑命令
1.pwd:显示用户当前所处的工作目录 举例:[root@Centos ~]# pwd /root 2.cd:切换工作路径 "cd -"命令返回到上一次所处的目录 " ...
- vue-cli3移动端自适应配置 Vant组件库
module.exports = { presets: [ '@vue/app' ], plugins: [ ['import', { libraryName: 'vant', libraryDire ...