Warum wird Promise.all mit einem Array undefinierter Werte aufgelöst, wenn asynchrone Funktionen innerhalb einer Karte verwendet werden?

Promise.all Resolving Array of Undefined: Unveiling the Mystery

Promises bieten ein asynchrones Programmiermodell, das eine verbesserte Codelesbarkeit und Flusskontrolle ermöglicht. Manchmal treten jedoch unerwartete Probleme auf. Diese Frage untersucht, warum ein Promise.all ein Array undefinierter Werte zurückgibt und sich vorzeitig auflöst.

Der betreffende Code folgt einem typischen Promise-Chaining-Muster:

<code class="javascript">const getQueries = (models, dbId, dateStart, dateEnd) => {
  return new Promise((resolve, reject) => {
    // Fetch database and perform operations
    .then(extractQueries, reject)
      .then(sortQueries, reject)
      .then(onlyTen, reject)
      .then(addText, reject)
      .then((queries) => {
        console.log("getQueries finished", queries);
        resolve(queries);
      }, reject);
  });
};</code>

Nach erfolgreichem Abschluss der Initialisierung Vorgängen tritt das Problem innerhalb der addText-Funktion auf:

<code class="javascript">const addText = (queries) => {
  return Promise.all(queries.map((query) => {
    // Oops! We're missing a `return` here!
    models.queries.findById(query.queryId, {
      raw: true,
      attributes: ["query"],
    })
      .then((queryFetched) => {
        query.text = queryFetched.query;
        console.log(query);

        return Promise.resolve(query);
      }, (error) => {
        return Promise.reject(error);
      });
  }));
};</code>

Die Hauptursache des Problems liegt in der fehlenden Return-Anweisung in der Map-Callback-Funktion. Promise.all erwartet ein Array von Promise-Objekten, aber ohne die Rückgabe gibt der Rückruf für jedes Element im Abfrage-Array undefiniert zurück.

Infolgedessen wird Promise.all sofort mit einem Array von undefinierten Objekten aufgelöst, noch vorher Die tatsächlichen Versprechen innerhalb der Karte haben eine Chance, gelöst zu werden. Diese vorzeitige Lösung führt zu unerwartetem Verhalten und einer Reihe undefinierter Werte.

Um das Problem zu beheben, ist es wichtig, die Return-Anweisung vor jedem Promise-Aufruf in der Funktion addText hinzuzufügen:

<code class="javascript">const addText = (queries) => {
  return Promise.all(queries.map((query) => {
    return models.queries.findById(query.queryId, {
      raw: true,
      attributes: ["query"],
    })
      .then((queryFetched) => {
        query.text = queryFetched.query;
        console.log(query);

        return Promise.resolve(query);
      }, (error) => {
        return Promise.reject(error);
      });
  }));
};</code>

Jetzt wartet Promise.all ordnungsgemäß darauf, dass alle Promises im Array aufgelöst werden, was zur erwarteten Ausgabe führt, die die Abfrageergebnisse enthält.

Das obige ist der detaillierte Inhalt vonWarum wird Promise.all mit einem Array undefinierter Werte aufgelöst, wenn asynchrone Funktionen innerhalb einer Karte verwendet werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!