0

I am having a bit of a problem right now. I try using a global array and store information to it in one function and try to use the information inside it in another function, but when I try to access the info, it appears as empty, even though I call the function before accessing the information. Here is an example code:

var myArray = [];

functionThatLoops(parameter_Array, parameter2){
    for (item in parameter_Array){
        $.get(URL,
        {
            method: "endPointMethod",
            id: item["ID"]
        }, function(data){
            myArray.push(data)
        });
    }
}

mainFunction(){
    c = 1;
    for (array in AnotherMultiDimensionalArray){
        functionThatLoops(array,c);
    }
    console.log(myArray) //Displays Array with correct number of elements and correct info
    console.log(myArray.length) //Displays 0 and after this array appears to be empty

    for (item in myArray){ //Nothing prints out in this loop, as array appears empty
        console.log(item)
    }
}

What could be the problem? It looks like the code that fills the array is executing last...

Jose E. Hernandez
  • 41
  • 1
  • 5
  • Where are you calling `mainFunction()`? – Priyesh Kumar May 10 '17 at 05:15
  • Is `$.get` ajax call? – Poorna Rao May 10 '17 at 05:17
  • Are you sure it is empty or you think that because there is no call to your function – Osama May 10 '17 at 05:18
  • `$.get()` returns results asynchronously – guest271314 May 10 '17 at 05:18
  • `functionThatLoops()` calls an async ajax, on success result is appended to `myArray`. By the time success method is called, the following 2 `console.log` got executed and so `myArray` is empty ;) – Priyesh Kumar May 10 '17 at 05:18
  • @PriyeshKumar this is just an example code of what´s happening. In reality, mainFunction is a click event. I used this because the real code itself is really huge, but the only problem is this part right here. – Jose E. Hernandez May 10 '17 at 05:20
  • @PriyeshKumar What can I do to correct this? – Jose E. Hernandez May 10 '17 at 05:21
  • If you are doing the same thing in your real code, then still problem is the same! Do you want to wait for all `$.get()` to get finished before further processing on myArray? – Priyesh Kumar May 10 '17 at 05:24
  • @PriyeshKumar That is correct, I need to wait for all the $.get() to insert data inside myArray, and then I need to process that data inside it. – Jose E. Hernandez May 10 '17 at 05:26
  • Use `$.when()`, `.apply()`; substitute `$.map()` for `for..in` loop. `functionThatLoops(parameter_Array, parameter2) { return $.when.apply($, $.map(parameter_Array, function(item) { return $.get(URL, {method:"endPointMethod", id:item["ID"]}) .then(function(data) {myArray.push(data)}) })) } function mainFunction() { var c = 1; $.when.apply($, $.map(AnotherMultiDimensionalArray, function(array) { return functionThatLoops(array,c); }) .then(function() { console.log(myArray) }) }` – guest271314 May 10 '17 at 05:30
  • The issue is `for..in` loops do not wait for jQuery promise returned by `$.get()`. – guest271314 May 10 '17 at 05:33

0 Answers0