I’m pretty familiar with it, but it’s really hard to describe.

What is the Promise

Promise is a solution to asynchronous programming.

role

Fix the legendary callback hell to make code more maintainable.

usage

Promise is a new feature in ES6 and is itself a constructor. Accept a Function that takes two arguments (resolve: Function, reject: Function) to indicate the successful and failed callback functions. An instance of a Promise can respond to a resolve callback with then and a catch callback with reject.

Resolve \ Reject \all\race, the static method commonly used by the Promise class

• A race is the equivalent of a race in which multiple promises are passed in, prioritizing the Promise with the fastest state change, regardless of whether the result is a success or failure.
• All Multiple Promise tasks are executed simultaneously. If all are successfully executed, the results of all Promise tasks are returned as an array. If there is a Promise task Rejected, only the result of the Rejected task is returned.

How to do that?

According to the Promise A+ specification, implementing this in its full form is cumbersome. Put this in a simple version, should be enough for an interview. Satisfy asynchronous and THEN chain calls.

There are three states, plus publish-subscribe responses to asynchronous callbacks.

    const PENDING = "pending";
    const FULFILLED = "fulfilled";
    const REJECTED = "rejected";

    class Promise {
      constructor(executor) {
        if(! executor)return;
        this.state = PENDING;
        this._value = null;
        this._fulfilledQueues = [];
        this._rejectedQueues = [];

        let handleResolve = (value) = > {
          this._value = value;
          this.state = FULFILLED;
          this._fulfilledQueues.forEach((fn) = > {
            fn(value);
          });
        };
        let heandleRejected = (value) = > {
          this._value = value;
          this.state = REJECTED;
          this._rejectedQueues.forEach((fn) = > {
            fn(value);
          });
        };
        executor(
          (data) = > {
            if (this.state ! == PENDING)return;
            setTimeout(handleResolve, 0, data);
          },
          (err) = > {
            if (this.state ! == PENDING)return; heandleRejected(err); }); }then(onFulfilled, onRejected) {
        return new Promise((nextFulfilled, nextRejected) = > {
          const complexFulfilled = (data) = > {
            nextFulfilled(onFulfilled(data));
          };
          const complexRejected = (data) = > {
            nextRejected(onRejected(data));
          };
          if (this.state === PENDING) {
            this._fulfilledQueues.push(complexFulfilled);
            this._rejectedQueues.push(complexRejected);
          } else if (this.state === FULFILLED) {
            nextFulfilled(this._value);
          } else if (this.state === REJECTED) {
            complexRejected(this._value); }}); }}/ / test
    new Promise((resolve, reject) = > {
      resolve(1);
    })
      .then((data) = > {
        console.log(data);
        return 2;
      })
      .then((data) = > {
        console.log("resolve: " + data);
      });
    / / 1
    // resolve: 2
Copy the code