How to use Array.prototype.map() with then() for connection.end()

Viewed 9473

I have an error TypeError: cars.map(...).then is not a function. I want terminate connection when update the color.

cars.map(function (item, i) {
    if (item.color === 'red') {
        updateColor(item.id)
    }
}).then(() => connection.end())
2 Answers

This answer only applies in case updateColor is asynchronous and indeed returns a Promise object.

.map returns an array of something, not a Promise. What you can do, is building an array of Promise using .map and then resolve them all using Promise.all and then deal with the result.

The following code will execute all updateColor, wait until they are done and then stop the connection.

Promise.all(cars.map((item, i) => {
    if (item.color === 'red') {
      return updateColor(item.id);
    }

    return false;
  }))
  .then(() => connection.end())

Using async/await instead of Promises

  await Promise.all(cars.map((item) => {
        if (item.color === 'red') {
          return updateColor(item.id);
        }

        return false;
      }));

   connection.end();

using reduce instead of map

await Promise.all(cars.reduce((tmp, x) => (x.color === 'red' ? [
  ...tmp,

  updateColor(x.id),
] : tmp), []));

connection.end();

There are a couple of issues there:

  1. There's no reason to use map when you aren't using the array it creates. To loop through the array, use forEach or any of several other mechanisms.

  2. map is a fully synchronous function. To do something after it, just...do the thing after it.

  3. then is a method of promises (well, thenable). map returns an array, not a promise.

So:

for (const item of cars) {
    if (item.color === 'red') {
        updateColor(item.id)
    }
};
connection.end();

If updateColor does its work asynchronously and returns a promise, then see Grégory NEUT's answer.

Related