0. The purpose of the Promise

The Promise object is used to represent the final completion (or failure) of an asynchronous operation and its resulting value. A Promise object represents a value that is not necessarily known when the Promise is created. It allows you to associate the eventual success return value or failure cause of an asynchronous operation with the appropriate handler.

Promises were invented to solve the problem of callback hell. For example, if you want a result request to have multiple interfaces whose parameters depend on the data returned by other interfaces, we need to nest layer after layer, but with promises we don’t need to nest layer after layer, making our code more readable. It also standardizes the name or order of callbacks, and makes it easy to catch errors.

1. How do I create a New Promise

function fn(){
    return new Promise((resolve, reject) = >Resolve (data) on success, reject(reason) on failure})}Copy the code

For example,

const promise1 = new Promise((resolve, reject) = > {
  resolve('Success! ');
});

promise1.then((value) = > {
  console.log(value);
  // expected output: "Success!"
});

Copy the code

2. How to use promise.prototype. then

The then() method returns a Promise. It needs at most two arguments: a callback to Promise’s success and failure cases.

Grammar:

p.then(onFulfilled[, onRejected]);

p.then(value= > {
  // fulfillment
}, reason= > {
  // rejection
});
Copy the code

For example:

const promise1 = fn() // Get the promise1 object
fn().then(success, fail).then(success2, fail2).catch(fail3)
Copy the code

3. How to use 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. The Promise’s resolve callback is executed when all the incoming Promise’s resolve callbacks have ended, or when no promises are left in the input iterable. Its Reject callback execution throws an error as soon as any incoming promise’s Reject callback is executed or an invalid promise is entered, and reject is the first error message thrown.

In simple terms, promise.all ([promise1, promise2]) runs in parallel, waiting for all promises to succeed. If both succeed, then the promise corresponding to all succeeds; If one fails, the promise corresponding to all fails.

Grammar:

Promise.all(iterable);
Copy the code

Example:

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

4. How to use promise.race

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

Grammar:

Promise.race(iterable);
Copy the code

Example:

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