Resolve Promise or add Callback after Array push() method

Question

I am using map() over a long array and using fetch for each value. It will take many seconds to complete. I would like to know when the final push is complete and use the data in the array.

I tried Promise, Promise.all, Async/Await, but may have missed something obvious. I created this sample code to more simply illustrate the problem.

const arr = new Array(100).fill("todos")
const arrPush = []

const result = arr.map(data => {
  fetch(`https://jsonplaceholder.typicode.com/${data}`)
  .then(res => res.json())
  .then(res => arrPush.push(res))
})

Promise.all(result).then(() => console.log(arrPush))

When the final value is added to array, do something. In this case console.log the complete array.

Nicholas Tower · Accepted Answer · 2019-03-23 02:14:34Z

3

The function that you're passing to map doesn't have a return statement, so result is an array of undefineds. As a result, there's nothing for Promise.all to wait for.

Additionally, there's no need to manually push into an array. Once we add in the return statement, you'll have an array of promises, and Promise.all will resolve to an array with all the stuff you're currently trying to push.

So try this:

const arr = new Array(100).fill("todos")
const promises = arr.map(data => {
  return fetch(`https://jsonplaceholder.typicode.com/${data}`)
    .then(res => res.json());
});

Promise.all(promises)
  .then(arrayOfResults => console.log(arrayOfResults));

edited Mar 23, 2019 at 2:14

answered Mar 23, 2019 at 2:01

Nicholas Tower

87k10 gold badges115 silver badges127 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

seedy Over a year ago

awsome thanks! I know thats where I started but headed down a wrong path. I think I assumed the return was the response, if that makes sense.

Collectives™ on Stack Overflow

Resolve Promise or add Callback after Array push() method

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related