更多文章详见公众号【前端css和js干货】
Promise是Es6最令人兴奋的个性,在那之前人们可能会通过第三方库如Bluebird或Q应用过promise,然而直到2015年才成为js的规范个性。
Promise 对象代表一个异步操作的实现(或失败)以及他的后果值。
Promise 会做一些可能须要一些工夫的事件,但最终它会在一切顺利时resolve,或者如果呈现问题则reject。 而后应用.then 和 .catch别离对result或error做一些事件。
const promise = new Promise(function(resolve, reject) { setTimeout(() => { if (Math.random(1) > 0.5) { resolve('Some value'); } else { reject('Some error'); } }, 500);});promise.then((response) => { console.log(response);}).catch(err => { console.log(err);});
ES2020 带来了一个新个性:Promise.allSettled。补救了 ES6 Promise.all 和 Promise.race留下的缺点。
promises数组
咱们常常不仅要解决一个 Promise,还要解决一系列的 Promise。 如果一次发送许多服务器申请,可能就是这种状况。
例如,我创立了一个蕴含五个 Promise 的数组。 在一段时间(100 毫秒、200 毫秒、……、500 毫秒)后,它们以 50% 的概率rsolve或rejected。
const arrayOfPromises = [];const arrayOfResponses = [];for (let i = 0 ; i < 5; i += 1) { arrayOfPromises.push(new Promise((resolve, reject) => { setTimeout(() => { if (Math.random(1) > 0.5) { resolve('Some value'); } else { reject('Some error'); } }, i * 100); }));}arrayOfPromises.forEach((promise) => { promise.then((response) => { arrayOfResponses.push(response); }).catch((err) => { arrayOfResponses.push(err); });});
咱们能够手动解决这个 Promise 数组,在示例中将后果存储在arrayOfResponses数组中。 如果半秒后在控制台中显示数组,将看到如下内容:
然而咱们常常想在所有 Promises resolve了或者一旦其中一个settles了之后做一些事件。 这有点辣手,这就是Promise.all和Promise.race存在的起因。
Promise.race
Promise.race 以一组 Promise 为参数并返回一个 Promise。 该 Promise 将在数组的Promise 其中之一resolve或reject后立刻resolve。
const promiseRace = Promise.race(arrayOfPromises);promiseRace.then(() => console.log('One resolved')) .catch(() => console.log('One rejected'));
Promise.all
Promise.all会在promise数组的每个元素都resolve了之后resolve。
const promiseRace = Promise.race(arrayOfPromises);promiseRace.then(() => console.log('One resolved')) .catch(() => console.log('One rejected'));
然而,如果只有数组中的一个 Promise 产生reject,Promise.all 也会reject。
ES2020 Promise.allSettled
您可能心愿在所有 Promise settled后立刻执行某些操作,无论它们是否已resolve或reject。 这就是 Promise.allSettled 的用处。
const promiseAllSettled = Promise.allSettled(arrayOfPromises)promiseAllSettled.then(response => console.log(response));
Promise.allSettled 将在所有 Promise resolve或reject时resolve。 返回值是一个对象数组,带有状态(rejected 或 fulfilled)和值(或谬误)。
总结
Promise.all 将在一个 Promise reject后立刻reject,而 Promise.race 将在一个 Promise resolve后立刻resolve,而 Promise.allSettled 将始终resolve,并且只在每个 Promise 都settled后才resolve。
Promise.allSettled 是 ES2020 的一项个性,已在 Node v.12.9.0、Google Chrome 76、Safari 13 和 Firefox 71 中失去反对。
作者:Heloise Parein 译者:前端css和js干货 起源:gitconnected