Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie führe ich eine Folge von Versprechen in JavaScript synchron aus?

DDD
Freigeben: 2024-11-06 22:15:02
Original
238 Leute haben es durchsucht

How to Synchronously Execute a Sequence of Promises in JavaScript?

Wie synchronisiert man eine Folge von Versprechen?

In diesem Szenario haben wir ein Array von Versprechensobjekten, die in der genauen Reihenfolge aufgelöst werden müssen, die im Array angegeben ist. Wenn außerdem ein Element abgelehnt wird, sollte die gesamte Kette sofort abgelehnt werden, um weitere Versuche zur Auflösung nachfolgender Elemente zu verhindern.

Manuelle Iteration

Hier ist ein Beispiel, das die manuelle Iteration für die sequentielle Ausführung von Versprechen zeigt:

function processArray(array, fn) {
  var index = 0;

  function next() {
    if (index < array.length) {
      fn(array[index++]).then(next);
    }
  }
  return next();
}
Nach dem Login kopieren

Diese Funktion benötigt ein Array und eine Versprechen-zurückgebende Funktion fn als Argumente. Es durchläuft das Array, ruft fn für jedes Element auf und übergibt das Ergebnis an die nächste Iteration.

Verwenden von .reduce() mit Promise

function processArray(array, fn) {
  return array.reduce((p, item) => {
    return p.then(() => {
      return fn(item).then((data) => {
        results.push(data);
        return results;
      });
    });
  }, Promise.resolve());
}
Nach dem Login kopieren

Dieser Ansatz verwendet die Methode Reduce() um eine Reihe von Ergebnissen zu sammeln. Jedes Element im Array wird nacheinander verarbeitet, wobei das von fn zurückgegebene Versprechen verwendet wird, um die Iteration voranzutreiben.

Verwendung der Bluebird Promise Library

Die Bluebird Promise Library bietet praktische Methoden für die Handhabung asynchroner Vorgänge. einschließlich sequentieller Iteration.

Promise.mapSeries(arr, (item) => {
  // process each individual item here, return a promise
  return processItem(item);
}).then((results) => {
  // process final results here
}).catch((err) => {
  // process error here
});
Nach dem Login kopieren

Die Promise.mapSeries()-Methode nimmt ein Array und eine Versprechen erzeugende Funktion und gibt ein Versprechen zurück, das in ein Array aufgelöster Ergebnisse aufgelöst wird.

Mit ES7 async/await

Mit der ES7-Async/await-Syntax können sequentielle asynchrone Vorgänge prägnanter und lesbarer geschrieben werden:

async function processArray(array, fn) {
  let results = [];
  for (let i = 0; i < array.length; i++) {
    let r = await fn(array[i]);
    results.push(r);
  }
  return results; // will be resolved value of promise
}
Nach dem Login kopieren

In diesem Beispiel iteriert die Funktion „processArray“ durch die Array, verwenden Sie „await“, um die Schleife anzuhalten, bis jedes von fn zurückgegebene Versprechen aufgelöst ist.

Auswahl des richtigen Ansatzes

Der beste Ansatz zum Synchronisieren einer Folge von Versprechen hängt von Faktoren wie der Anzahl der Versprechen ab Elemente im Array, die Komplexität der Verarbeitungsfunktion fn und das gewünschte Fehlerbehandlungsverhalten. Für kleinere Arrays und einfache Verarbeitungsfunktionen kann eine manuelle Iteration oder die Verwendung von Promise.mapSeries() von Bluebird ausreichen. Für komplexere Szenarien ist die Verwendung von async/await oder einer benutzerdefinierten Lösung wie der in der endgültigen Antwort möglicherweise besser geeignet.

Das obige ist der detaillierte Inhalt vonWie führe ich eine Folge von Versprechen in JavaScript synchron aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!