Passing array details through an anonymous function

Question

Sorry if this is a basic question but I am struggling to understand how to do this.

I am trying to pass an array of passenger details through an anonymous function using the Google Places API. I am using this array details everywhere so I want to it be available in all functions. As soon as I am in the anonymous function in getDetails it looses reference to i. What I really want to do is get the value of i in displaydetails function so I can access the details there to display them in a marker.

Can anyone give me a pointer on how to do this?

Thanks in advance

var locations = [
    ['Mr Andrew Star', 35.776721, 140.392130, 'Tailor Made', '123456', 'ChIJVze90XnzImARoRp3YqEpbtU'],
    ['Miss Mary Jane', 35.684960, 139.761285, 'Group Tour', '123456', 'ChIJX1MLAgiMGGARBOTc8MbjVUU']
]

function displaydetails( place, status, image, i) {

    if (status === google.maps.places.PlacesServiceStatus.OK) {

        var marker = new google.maps.Marker({
            map: map,
            icon: image,
            position: place.geometry.location,
            title: locations[i][0] //not currently working
        });

    ....
    }
}

function placeMarkers() {
   for (i = 0; i < location.length; i++) {
      service.getDetails({
        placeId: locations[i][5]
      }, function (place, status) {
        displaydetails(place, status, image, i);
      });
   }
}

score 0 · Answer 1 · answered Aug 13 '15 at 14:05

Pass 'i' in as a parameter to the function:

function displaydetails( place, status, image, i) {

    if (status === google.maps.places.PlacesServiceStatus.OK) {

        var marker = new google.maps.Marker({
            map: map,
            icon: image,
            position: place.geometry.location,
            title: locations[i][0] //not currently working
        });

    ....
    }
}

score 0 · Answer 2 · answered Aug 13 '15 at 14:19

0

I tried that, I have amended the code to what I have tried as I was a bit unclear, sorry. 'i' returns as undefined... seems the value is getting lost. I did a lot of debugging and the value seems to be getting lost after the anonoymous function.

Any other ideas?

answered Aug 13 '15 at 14:19

annemarie

71
1
5

In your for loop you are calling service.getdetails. Is this another function in your code? you pass a function to this with place and status but where are you getting these from? – Stacey Burns Aug 13 '15 at 16:16

score 0 · Answer 3 · edited May 23 '17 at 12:22

Try 'capturing' the value of i, as in my code below. To see why this works, read my explanation of closures and value capturing in this answer

var locations = [ ['Mr Andrew Star', 35.776721, 140.392130, 'Tailor Made', '123456', 'ChIJVze90XnzImARoRp3YqEpbtU'], ['Miss Mary Jane', 35.684960, 139.761285, 'Group Tour', '123456', 'ChIJX1MLAgiMGGARBOTc8MbjVUU'] ]

function displaydetails( place, status, image, i) {

    if (status === google.maps.places.PlacesServiceStatus.OK) {

        var marker = new google.maps.Marker({
            map: map,
            icon: image,
            position: place.geometry.location,
            title: locations[i][0] //not currently working
        });

    ....
    }
}

function placeMarkers() {
   for (i = 0; i < location.length; i++) {
      service.getDetails({
        placeId: locations[i][5]
      }, 
      // This is the bit I've changed, to capture the current value of
      // i and store it as captured_i
      function(captured_i) {
           return function (place, status) {
             displaydetails(place, status, image, captured_i);
           }
      }(i));
   }
}

Passing array details through an anonymous function

3 Answers3