Javascript - How To Work With The Iterator In A For Loop With Callbacks

I am trying in the for loop to access the value of the i with which the callback function uses. How can I do this? for (var i = 0; i < a.length; i++) { calcRoute(fixedLocati

Solution 1:

It's because the closure captures the variable i itself, not the current value. Try:

for (var i = 0; i < a.length; i++) (function(i)
{
    calcRoute(fixedLocation, my_cities[i].address, function(response) {

        // i want here to have the current "i" here

    });             

}) (i);

which will create a new i variable for each loop iteration.

Solution 2:

Probably the most elegant way to do it is just using Array.forEach:

a.forEach(function(someA, i) {
    calcRoute(fixedLocation, my_cities[i].address, function(response) {

        // i want here to have the current "i" here

    });
});

The callback function gets passed:

1. the current element
2. the current index
3. the array it was called upon

Leaving out arguments just means you can’t access them in the callback. (Often you leave out the index and just use the current element).

---

If a is a NodeList, which doesn’t have forEach, just do:

Array.forEach.call(a, function(someA, i) { ... }

Solution 3:

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

  function createCallback(i) {
    return function(response) {
      // i want here to have the current "i" here
    }
  }

  calcRoute(fixedLocation, my_cities[i].address, createCallback(i));
}