Heim  >  Artikel  >  Web-Frontend  >  Analyse des Quellcodes von es6-promise

Analyse des Quellcodes von es6-promise

不言
不言nach vorne
2019-03-23 10:03:182818Durchsuche

Der Inhalt dieses Artikels befasst sich mit der Analyse des es6-Promise-Quellcodes. Ich hoffe, dass er für Freunde hilfreich ist.

Hauptlogik:

Im Wesentlichen ist es immer noch dasselbe wie die Rückruffunktion.
Die Unterscheidung zwischen asynchron und synchron wird durch die Beurteilung von _Abonnenten vervollständigt.
Vervollständigen Sie den Ablauf der Then-Kette durch „Resolve“, „Reject“ –> > Synchronisationsfunktionsablauf: Konstruktor -> Veröffentlichung -> >

Hauptfunktionsanalyse


1. Konstruktor

Funktion: Auflösung und Ablehnung an Resolver binden-

constructor(resolver) {
    this[PROMISE_ID] = nextId();
    this._result = this._state = undefined;
    this._subscribers = [];
    <!-- 判断resolver是不是一个空对象 -->
    if (noop !== resolver) {
      typeof resolver !== 'function' && needsResolver();
      <!-- 把resolve,reject绑定到 resolver上-->
      this instanceof Promise ? initializePromise(this, resolver) : needsNew();
    }
  }

2 dann

Funktion: Rückruf setzen Die Funktion ist an _subscribers gebunden und schließlich sind im Wesentlichen syntaktischer Zucker für then

Der Parameter von _subscribers ist ein Array, [0] ist sein untergeordnetes Element, das an das übergeordnete Element der nächsten then-Kette gebunden ist und zum rekursiven Veröffentlichen verwendet wird Der zweite ist der Resolve-Callback, der dritte ist der Reject-Callback.

export default function then(onFulfillment, onRejection) {
  const parent = this;
  <!-- 用于then链的返回值,下一条then就是当前parent的child -->
  const child = new this.constructor(noop);

  if (child[PROMISE_ID] === undefined) {
    makePromise(child);
  }

  const { _state } = parent;
 <!-- 判断_state的状态,是不是PENDING -->
  if (_state) {
    const callback = arguments[_state - 1];
    asap(() => invokeCallback(_state, child, callback, parent._result));
  } else {
    subscribe(parent, child, onFulfillment, onRejection);
  }

  return child;
}

3 Publish

-Funktionen: Resolve, das Auslösen von Reject ruft Publish auf, Publish ruft weiterhin auf invokeCallback und geben Sie den Wert zurück Rufen Sie weiterhin „resolve“ und „reject“ auf, um eine Rekursion zu bilden und den Ablauf der then-Kette zu vervollständigen

function publish(promise) {
  let subscribers = promise._subscribers;
  let settled = promise._state;

  if (subscribers.length === 0) { return; }

  let child, callback, detail = promise._result;

  for (let i = 0; i < subscribers.length; i += 3) {
    child = subscribers[i];
    callback = subscribers[i + settled];

    if (child) {
      invokeCallback(settled, child, callback, detail);
    } else {
      callback(detail);
    }
  }

  promise._subscribers.length = 0;
}
Tipp:

finally callback hat keine Rückgabeparameter, basierend auf

return promise.then(value => constructor.resolve(callback()).then(() => value),
                         reason => constructor.resolve(callback()).then(() => { throw reason; }));
Dieser Artikel ist hier zu Ende. Weitere spannende Inhalte finden Sie in der Spalte JavaScript-Video-Tutorial
auf der chinesischen PHP-Website!

Das obige ist der detaillierte Inhalt vonAnalyse des Quellcodes von es6-promise. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:segmentfault.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen