preface

The basic uses of promise.resolve (), promise.reject (), promise.then (), promise.catch () already solve most of our needs. In this article I’ll share a few useful functions that Promise doesn’t use very often.

Promise.all()

The promise.all () method accepts an iterable of promises. Array, Map, and Set are all ES6 iterable types), and only one Promise instance is returned. The result of the resolve callbacks to all of those entered promises is an Array.

With ALL, you can perform multiple asynchronous operations in parallel and process all returned data in a single callback. The data returned is in the same order as the array of parameters passed.

const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) = > {
  setTimeout(resolve, 100.'foo');
});

Promise.all([promise1, promise2, promise3]).then((values) = > {
  console.log(values);
});
// expected output: Array [3, 42, "foo"]
Copy the code

The promise.all () method returns two states for the Promise instance

Fulfillment:

If the iterable passed in is empty, promise.all returns a Promise with a completed state synchronously.

The promise returned by promise.all becomes completed asynchronously if all incoming promises become complete, or if there are no promises in the incoming iterable.

In any case, the result of the completion state of the Promise returned by promise.all is an array containing the values of all the passed iteration parameter objects (including non-Promise values).

Rejection:

If a promise is passed in with a failed promise, promise. all asynchronously gives the failed result to the failed state callback, regardless of whether the other promise is completed.

Promise.all waits for everything to complete (or the first failure).

var p1 = Promise.resolve(3);
var p2 = 1337;
var p3 = new Promise((resolve, reject) = > {
  setTimeout(resolve, 100.'foo');
});

Promise.all([p1, p2, p3]).then(values= > {
  console.log(values); // [3, 1337, "foo"]
});
Copy the code

Promise.race()

The promise.race (iterable) method takes an iterable type of a Promise and returns a Promise that is resolved or rejected once a Promise in the iterator is resolved or rejected.

const promise1 = new Promise((resolve, reject) = > {
  setTimeout(resolve, 500.'one');
});

const promise2 = new Promise((resolve, reject) = > {
  setTimeout(resolve, 100.'two');
});

Promise.race([promise1, promise2]).then((value) = > {
  console.log(value);
  // Both resolve, but promise2 is faster
});
// expected output: "two"

Copy the code

Promise.any()

Promise.any() receives a Promise iterable and returns the Promise that succeeded as soon as one of the promises succeeds.

const pErr = new Promise((resolve, reject) = > {
  reject("Always fail");
});

const pSlow = new Promise((resolve, reject) = > {
  setTimeout(resolve, 500."Finally done");
});

const pFast = new Promise((resolve, reject) = > {
  setTimeout(resolve, 100."Soon done.");
});

Promise.any([pErr, pSlow, pFast]).then((value) = > {
  console.log(value);
  // pFast fulfils first
})
// Expected output: "soon done"
const pErr = new Promise((resolve, reject) = > {
  reject('Always fail');
});

Promise.any([pErr]).catch((err) = > {
  console.log(err);
})
AggregateError: No Promise in Promise. Any was resolved"

Copy the code

conclusion

All three methods are used to handle asynchrony in parallel execution, and we chose according to our requirements:

  • Promise.all() : Returns a list of successes for all successes and a failure for one failure
  • Promise.race() : returns the fastest first regardless of success or failure
  • Promise.any() : returns the first success, failure if no success