Home > Web Front-end > JS Tutorial > Why is Promise.all Returning an Undefined Array and Resolving Prematurely?

Why is Promise.all Returning an Undefined Array and Resolving Prematurely?

Linda Hamilton
Release: 2024-10-31 21:19:02
Original
750 people have browsed it

Why is Promise.all Returning an Undefined Array and Resolving Prematurely?

Promise.all Returning Undefined Array and Resolving Prematurely

Promise.all is designed to accept an array of Promise objects and resolve once all of the Promises in the array have resolved. In the provided code, however, the issue arises because the callback function passed to Promise.all's map doesn't return a Promise.

Within the addText function:

<code class="javascript">function addText(queries) {
  return Promise.all(queries.map(function(query) {
    // Missing `return` statement causes undefined values in the array
    models.queries
      .findById(query.queryId, {
        raw: true,
        attributes: [ "query" ]
      })
      .then(function(queryFetched) {
        query.text = queryFetched.query;
        console.log(query);

        // Return the updated query as a resolved Promise
        return Promise.resolve(query);
      }, function(error) {
        // Return the error as a rejected Promise
        return Promise.reject(error);
      });
  }));
};</code>
Copy after login

Here's what's happening:

  1. The map callback doesn't return a Promise, so the resulting array contains undefined values.
  2. Promise.all immediately resolves the resulting array of undefined values.
  3. Subsequently, the .then() callback receives an array of undefined values instead of an array of Promises.

To fix this issue and ensure that Promise.all resolves only after all Promises in the callback have resolved, the callback must explicitly return Promises:

<code class="javascript">function addText(queries) {
  return Promise.all(queries.map(function(query) {
    // Added `return` statement to wrap the Promise in the callback
    return models.queries
      .findById(query.queryId, {
        raw: true,
        attributes: [ "query" ]
      })
      .then(function(queryFetched) {
        query.text = queryFetched.query;
        console.log(query);

        return Promise.resolve(query);
      }, function(error) {
        return Promise.reject(error);
      });
  }));
};</code>
Copy after login

Now, the map callback returns Promises, which Promise.all can properly handle and resolve only once all Promises have resolved.

The above is the detailed content of Why is Promise.all Returning an Undefined Array and Resolving Prematurely?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template