在forEach循环后如何填充数组

Question

const tileApiPromises = [];
 response.data.forEach((tile) => {
     return getPartnerToken(tile.id).then((response) => {
         tileApiPromises.push(getTileContent(tile, response));
     });
 });
 console.log(tileApiPromises) // should give me an array of promises
 Promise.all(tileApiPromises) // The goal is to execute this.

I am getting empty array of course in the log. How can I get array with promises outside the forEach. Thanks for your help!

Answer 1

The problem with your code is that the push is done asynchronously - therefore, there's nothing in the array yet!

you say you tried map (in the comment) - did you try it like this?

const tileApiPromises = response.data.map((tile) => {
     return getPartnerToken(tile.id).then((response) => {
         return getTileContent(tile, response);
     });
 });

or, sexier

const tileApiPromises = response.data.map(tile => 
    getPartnerToken(tile.id).then(response => getTileContent(tile, response))
);

Answer 2

You can use Array.map function instead of forEach.

forEach always return undefined.

while map function iterates over array provided and returns accumulated array of values returned in callback provided in map function.

Here is nice documentation on map function. https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/map