关于promise:Promiseall-Promiserace-以及ES2020-新特性-PromiseallSettled

更多文章详见公众号【前端 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