0

I am facing some stupid issue for which I know I am missing something.

I have a blank array in which I am pushing stuff using .push() method.

Now When I print complete array, I get values, but when I use array.length then it is always zero. I know it is very silly something that I am missing.

var markersToPush = [];

for (var i = 0; i < contactList.length; i++) {
    console.log('conatcat addres', contactList[i].MailingStreet);
    geocoder.geocode({
        'address': contactList[i].MailingStreet
    }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
            markersToPush.push(marker.getPosition());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
console.log('markers to push-->', markersToPush);
console.log('markers length-->', markersToPush.length);

For result in log -

enter image description here

I have already checked other linked issues -

  1. Javascript array returns length as 0 always even there are elements in it
  2. Javascript array returns length as 0 always even there are elements in it
  3. Array Length returns 0
Community
  • 1
  • 1
Kaushik Ray
  • 555
  • 2
  • 8
  • 21
  • 1
    Please post your code *here* – Andrew Li Jul 17 '16 at 22:32
  • added relevant code portions – Kaushik Ray Jul 17 '16 at 22:34
  • 4
    Please post code as text, not a picture of code. Anyway, I think you'll find the array is empty at the time you log it, but that it has data by the time you expand it in the console. (If you log `JSON.stringify(markersToPush)` that would confirm it.) You are calling an asynchronous function, `geocoder.geocode()`, and the callback function you pass to it won't be called with the data until after the loop ends and after the `console.log()` statements. See [this question](http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call). – nnnnnn Jul 17 '16 at 22:34
  • Check the keys in the `array(10)`. Are they numeric? – Will Jul 17 '16 at 22:35
  • added expanded snapshot of log – Kaushik Ray Jul 17 '16 at 22:38
  • I have both of my console logs out of async callout scope. fist log shows result second log shows zero value – Kaushik Ray Jul 17 '16 at 22:39
  • 1
    You don't seem to be outputting the `length` property but rather the `size` property. – Boaz Jul 17 '16 at 22:40
  • I was trying multiple things. But I have tried both and non worked. Updated question – Kaushik Ray Jul 17 '16 at 22:40
  • Pay attention to what @nnnnnn pointed out. All the others asking questions are ignoring the fact this is an asynchronous request. You can't count what hasn't been delivered yet – charlietfl Jul 17 '16 at 22:41
  • @nnnnnn, charlietfi I have both my console logs out of async scope. First console log gives result second gives 0 size. So it should not be async issue if I am not wrong – Kaushik Ray Jul 17 '16 at 22:42
  • But the console is being updated after you try to get the length. Console is not a snapshot....objects are inherited there – charlietfl Jul 17 '16 at 22:43
  • To see this issue with console change what you have outside to: `console.log('markers to push-->', markersToPush.toString());` and you will see snapshot and it should be empty – charlietfl Jul 17 '16 at 22:49
  • Yup you both are right about async – Kaushik Ray Jul 17 '16 at 22:50
  • Now the issue is asyn call is happening inside for loop. and after the for loop is over I need to perform functions like set bound etc which I do not want to do in every async call. – Kaushik Ray Jul 17 '16 at 22:50
  • @KaushikRay you have to, that's how asynchronous coding is done. You can wrap all your other processing code in functions and call those inside – charlietfl Jul 17 '16 at 22:52
  • 1
    Ya..that is kind of sad actiually. as this whole code is anyways getting called in another async call. Possibly need to use some promise resolution in mass from angular or similar..!! But thanks for the help.. – Kaushik Ray Jul 17 '16 at 22:53

1 Answers1

0

@nnnnnn is most likely correct in his comment. Looks like you're making an asynchronous call to geocoder.geocode(). You should try doing your console logs inside the callback function:

var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
            markersToPush.push(marker.getPosition());

            // log the length value here
            console.log('markers length-->', markersToPush.length);
        } else {

The reason you are seeing Array(10) when you log the object is the browser updates the buffer. You can try using a slice() to force this in the console with your current code like this:

console.log('markers length-->', markersToPush.slice().length);

That will create a new array and measure the length. But really, you should be doing all your work in the asynchronous callback function.

chris
  • 2,893
  • 3
  • 20
  • 22