How to push items in an array inside a promise function JavaScript

Question

I want to push the results from a promise function into an array however, the array remains empty. Can someone help pleaseThis is what I would like to achieve at the end, update my ejs file from the promise function. However, nothing happens once I do this.

var Data = [];
        raw.forEach(function (host) {
            ping.promise.probe(host.ip).then(function (res) {
                if(res.alive){
                    const input = {
                        "Host": i.host,
                        "IP": i.ip,
                        "Status": "Alive",
                        "Avg": res.avg
                    }
                    Data.push(input);
                }
                else {
                    const input = {
                        "Host": i.host,
                        "IP": i.ip,
                        "Status": "Dead",
                        "Avg": res.avg
                    }
                    Data.push(input);
                }
                });
        });
        console.log(Data);

Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — briosheje, Aug 05 '19 at 15:05
`Data` is populated, it's just that you're logging it **before** it is. — briosheje, Aug 05 '19 at 15:06
What change should I make to save data in the array then? Thanks! @briosheje — Amir, Aug 05 '19 at 15:10
as mentioned, **Data is populated**, you're just logging it **before** it is populated, you **can't** log data which will be populated in the **future**. You must move the code that uses `Data` in a function and invoke it **inside** the `.then` callback. check the duplicate link above, everything is explained in that post. — briosheje, Aug 05 '19 at 15:11
I want to populate the array 'data' and use it somewhere else. How to do that? Thanks! — Amir, Aug 05 '19 at 15:19
read my comment above. As mentioned, you need to **move the code that uses `Data` in a function and call the function INSIDE the .then callback**. — briosheje, Aug 05 '19 at 15:19
I have updated the question. Please view the image and its description and assist me in doing what I want to do. Thank you! — Amir, Aug 05 '19 at 15:35

score 0 · Answer 1 · answered Aug 05 '19 at 15:09

0

It seems like its empty, but it actually is not. Promises are asynchronous, which means when a promise is set- the code in the context in which it was created keeps running, and the then clause is executed only when the promise is resolved (or the .catch if its rejected).

You do this:

...promise.then( (res) => { data.push(res); } );
conosole.log(data);

But the console.log is executed BEFORE the promise resolved and the then clause is executed. If you move the console.log(data) inside the .then- you'll notice its populated :)

answered Aug 05 '19 at 15:09

Gibor

1,695
6
20

I want to populate the array 'data' and use it somewhere else. How to do that? Thanks! – Amir Aug 05 '19 at 15:18
So I am basically updating my html with the data inside the array 'data'. I am not sure how to that. – Amir Aug 05 '19 at 15:21
@Amir it really depends on what framework you use, what is the flow you're lookin for... basically you can do something like emit an event inside the `then` clause, or execute a function which you'll pass `Data` to it and this function will do the use-case you want. If none of these options is relevant to you- This is more of a design challenge and you should open another question where you describe the different neew problem with more details on your working environment, what exactly you're trying to do, where in your code you populate data and where do you wanna use it, etc – Gibor Aug 05 '19 at 15:25
I have attached an image above which explains what am I trying to achieve. Thank you! – Amir Aug 05 '19 at 15:34
I'm not really familiar with express, but I have few questions about the code in your picture: 1. why `data.push(input)` is duplicated? you can just do it after the `if-else`. 2. Why even use the Data variable if you delete it afterwards? if you really want to render an array with 1 object, you could just do `res.render("home", { data: [{...input}] }. 3. This one might be a complete mistake, but I Think that you render data and immediately set it to [] and this might cause a problem. if you use the method I described at 2, it will render a copy of input which might solve this. – Gibor Aug 06 '19 at 07:30

How to push items in an array inside a promise function JavaScript

1 Answers1