Call async function in map

Question

I have next code:

contents.map((content) => {
    const element = Object.assign({}, content);
    if (element.type === 'blabla') {
      element.data.id = await getId();
    }
    return element;
  });

But it fails with next error:

The 'await' operator can only be used in an 'async' function

Answer 1

Make each map function async and use Promise.all():

await Promise.all(contents.map(async content => ...);

The Promise.all() method takes an iterable of promises as an input, and returns a single Promise that resolves to an array of the results of the input promises. This returned promise will resolve when all of the input's promises have resolved, or if the input iterable contains no promises. It rejects immediately upon any of the input promises rejecting or non-promises throwing an error, and will reject with this first rejection message / error.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

Note that this means all content items are processed in parallel. If you want sequential execution, use for ... of instead. Each iteration may await as needed.

Answer 2

Just add async in starting of your function.

You cant use await without async.

contents.map(async (content) => {
    const element = Object.assign({}, content);
    if (element.type === 'blabla') {
      element.data.id = await getId();
    }
    return element;
  });

You have to provide whole code for correct result, i just wanted to tell you the mistake you are doing.