Javascript長度結果與數組不同

Question

我目前正在使用Google Maps API v3，使用jQuery和MarkerClusterer。

我注意到「長度」結果的一個奇怪的問題。所以，我會告訴你我的評論代碼：

文件data.json包含大約1800個對象。

function initialize() { 

$('#map_canvas').gmap({'zoom': 6, 'center': (new google.maps.LatLng(46.679594, 2.109375)), 'mapTypeId': google.maps.MapTypeId.ROADMAP, 'disableDefaultUI':true}).bind('init', function(evt, map) { 


    var mstime = new Date().getTime(); // to avoid caching 

    var markerslist = new Array(); // This array will gets points informations 

    $.getJSON('data.json?'+mstime, function(data) { 

     for (var i = 0; i < data.markers.length; i++) { 
      var val = data.markers[i]; 

      var t = new Object(); 
      t.lat = val.lat; 
      t.lng = val.lng; 
      t.name = val.label; 
      markerslist.push(t); // pushing point info in markerslist 
     } 

    }); 

    alert(markerslist.length); // This first alert returns "0" ! 
    alert(markerslist.length); // This new return the right count (about 1800). Weird! 


    for(var i = 0; i < markerslist.length; i++) { // To create markers on map 
     $('#map_canvas').gmap('addMarker', { 
      'position': new google.maps.LatLng(markerslist[i].lat, markerslist[i].lng) 
     }).click(function() { 
      $('#map_canvas').gmap('openInfoWindow', { content : 'Hello world!' }, this); 
     }); 
    } 



    $('#map_canvas').gmap('set', 'MarkerClusterer', new MarkerClusterer(map, $(this).gmap('get', 'markers'))); 

}); 


} 

綜上所述，此代碼的工作完美地與至少一個警報...... 如果刪除這兩個警報，此代碼不能正常工作。

感謝你的幫助， 問候

Answer 1

的getJSON調用是異步的。其結果是在調用回調之前的調用之後執行流程的流程。您需要將取決於調用結果的任何代碼添加到回調函數中，而不是在調用getJSON之後將其放置。

注意：對於代碼示例，我只是複製了代碼並移動了它。現在你知道所有的代碼都需要在回調中，我相信你可以優化它來消除對臨時數組的需求。

$.getJSON('data.json?'+mstime, function(data) { 

    for (var i = 0; i < data.markers.length; i++) { 
     var val = data.markers[i]; 

     var t = new Object(); 
     t.lat = val.lat; 
     t.lng = val.lng; 
     t.name = val.label; 
     markerslist.push(t); // pushing point info in markerslist 
    } 

    alert(markerslist.length); // it will be correct here 

    // now do the rest 

    for(var i = 0; i < markerslist.length; i++) { // To create markers on map 
     $('#map_canvas').gmap('addMarker', { 
      'position': new google.maps.LatLng(markerslist[i].lat, markerslist[i].lng) 
     }).click(function() { 
      $('#map_canvas').gmap('openInfoWindow', { content : 'Hello world!' }, this); 
     }); 
    } 

    $('#map_canvas').gmap('set', 'MarkerClusterer', new MarkerClusterer(map, $(this).gmap('get', 'markers'))); 
}); // and finally close the callback