JavaScript push Array into Array - Stack Overflow

admin管理员组

文章数量:1331629

I'm currently working with Google maps' geocoding and need to create an array that will contain arrays as an elements.

Basically i need to create this:

    var locations = [
      ['Bondi Beach', -33.890542, 151.274856, 4],
      ['Coogee Beach', -33.923036, 151.259052, 5],
      ['Cronulla Beach', -34.028249, 151.157507, 3],
      ['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
      ['Maroubra Beach', -33.950198, 151.259302, 1]
    ];

But dynamically! I need this array to put pins on a map later.

What I'm doing:

        var locations = []; // The initial array
        for (var i = 0; i < addresses.length; ++i){

            var address=addresses[i]; // the address e.g. 15 Main St, Hyannis, MA
            geocoder.geocode({ 'address': address}, function(results){
                var obj = {
                    0: address,
                    1: results[0].geometry.location.hb,
                    2: results[0].geometry.location.ib,
                    3: i
                };
                console.log(obj);
                locations.push(new Array());
                locations[i].push(obj);

            });
        };

        console.log(locations.length);

The problem, question:

I don't see any errors but at the end locations[] array is empty.

Here is a console screen if needed:

I'm currently working with Google maps' geocoding and need to create an array that will contain arrays as an elements.

Basically i need to create this:

    var locations = [
      ['Bondi Beach', -33.890542, 151.274856, 4],
      ['Coogee Beach', -33.923036, 151.259052, 5],
      ['Cronulla Beach', -34.028249, 151.157507, 3],
      ['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
      ['Maroubra Beach', -33.950198, 151.259302, 1]
    ];

But dynamically! I need this array to put pins on a map later.

What I'm doing:

        var locations = []; // The initial array
        for (var i = 0; i < addresses.length; ++i){

            var address=addresses[i]; // the address e.g. 15 Main St, Hyannis, MA
            geocoder.geocode({ 'address': address}, function(results){
                var obj = {
                    0: address,
                    1: results[0].geometry.location.hb,
                    2: results[0].geometry.location.ib,
                    3: i
                };
                console.log(obj);
                locations.push(new Array());
                locations[i].push(obj);

            });
        };

        console.log(locations.length);

The problem, question:

I don't see any errors but at the end locations[] array is empty.

Here is a console screen if needed:

• javascript
• arrays
• multidimensional-array
• google-geocoder

Share Improve this question Follow edited Feb 8, 2017 at 14:39 CommunityBot 111 silver badge asked Mar 1, 2013 at 16:17 rinchikrinchik 2,67088 gold badges3131 silver badges4747 bronze badges 3

• 3 geocode is async. You need to wait for ALL calls to reply before processing the array. – Prinzhorn Commented Mar 1, 2013 at 16:20
• Hm. I thought loop should be finished for script to continue? no? – rinchik Commented Mar 1, 2013 at 16:26
• The basic way to push an empty array into another away isn't obvious in this question, so I'll point out that for an array it's myArray.push(new Array()). myArray must at least be instantiated to an empty array i.e. myArray = [] – Chris Halcrow Commented Aug 22, 2018 at 6:50

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

This should be all you need:

geocoder.geocode({ 'address': address}, function(results){
            locations.push([
              address,
              results[0].geometry.location.hb,
              results[0].geometry.location.ib,
              i //this is actually going to always be 
                //addresses.length because the callback won't fire
                //until well after the loop has pleted. 
                //Is this really a necessary field to have 
                //in your array? if so, you'll need to refactor a bit
            ]);
        });

i didn't have time to test the code, but it should work this way:

    function requestLocations( addresses, callback ) {
        var remainingLocations = addresses.length;
        var locations = [];

        for (var i = 0; i < addresses.length; ++i){

            var address=addresses[i]; // the address e.g. 15 Main St, Hyannis, MA

            locations[i] = [];

            geocoder.geocode({ 'address': address}, (
                function(idx) {
                    return function(result) {
                        locations[idx] = [  addresses[idx], 
                                            results[0].geometry.location.hb,
                                            results[0].geometry.location.ib,
                                            idx
                                        ];

                        //decrement the number of remaining addresses
                        --remainingLocations;

                        //if there are no more remaining addresses and a callback is provided then call this calback with the locations
                        if( remainingLocations === 0 && callback ) {
                            callback(locations);
                        }               
                    }; // returns the real callback function for your geocoding

                })(i) //direct invocation of function with paramter i for scoping
            );

        }
    }


    requestLocations(addresses, function( locations ) {
        console.dir(locations);
        console.log(locations.length);
    });

The Problem with your code is the following. First this part of the code is executed:

        var locations = []; // The initial array
        for (var i = 0; i < addresses.length; ++i) {

            var address = addresses[i]; // the address e.g. 15 Main St, Hyannis, MA
            geocoder.geocode({
                'address': address
            }, function(results) {
                //this part is called later when that data is ready (it is an asynchronous callback)

            });
        };

        //because of the async request this is still 0
        console.log(locations.length);

After that the callbacks itself are called as soon as the browser receives the data from the server:

      function(results) {
        var obj = {
            0: address,
            1: results[0].geometry.location.hb,
            2: results[0].geometry.location.ib,
            3: i
        };
        console.log(obj);
        locations.push(new Array());
        locations[i].push(obj);

      }

本文标签： JavaScript push Array into ArrayStack Overflow