Question

I was going to write this to be long and complicated, but i figured to go to the straight forward approach.

I have a loop that creates an array of elements where the variable Url. The array looks like this:

 x = [url,function(){...},function(){...}];

and then into an arrayList:

 arrayList = [x1,x2,x3,x4,x5];

I figure that makes sense so far. It stores in the arrayList object, 1 var and 2 functions.

Here is the kicker.

When i iterate through arrayList, url is all the same, the last reference to url in the forloop that created the arraylist.

My attempt to solve this was, doing a .toString() on the variable to store the contents of it in the array, instead of the variable name itself. that didnt work 🙁

What would i do to resolve this? im stumped 🙁

Edit: I want to show what the loop looks like because 1 of the answers was about the array inaccurately referencing it

Edit2: The url which is causing issues, is the inner url, in displayFile below. It seems those are all pointing to the same reference, which is a nono. How would i go about changing those? Would i have to pass it in as a parameter???

var newArray = new Array();
for(var i=0;i<fileUrls.length;++i) {
   var url = fileUrls[i];
   var x = [];//new Array();
   x = [url,
    function(){
       displayFile(url, 'image', null, ft_id, null, null, null, null, !MA.isiOS());
    }, 
    function(e){
    if(DEBUG) console.log('Error creating gallery thumbnail');
    alert('There was a problem creating a thumbnail');
    MA.hideMessage();
    }
];
newArray.push(x);
}

Answer 1

What I think that you have is rather:

arrayList = [x,x,x,x,x];

I.e. an array that contains a number of references to the same object. If that is the case, then when you look at the url property in the different items, you are looking at the same property all the time, because it’s the same item over and over.

That would be the result of reusing the array to populate the arrayList array, for example:

var x = [];
var arrayList = [];
for (int i = 0; i < 5; i++) {
  x[0] = 'url ' + i;
  x[1] = function(){};
  x[2] = function(){};
  arrayList.push(x);
}

The solution would be to create a new array in each iteration:

var arrayList = [];
for (int i = 0; i < 5; i++) {
  var x = [];
  x[0] = 'url ' + i;
  x[1] = function(){};
  x[2] = function(){};
  arrayList.push(x);
}

---

Edit:

To get the url variable used in the displayFile call to be specific for each iteration, you need a closure to capture the value:

var newArray = new Array();
for(var i=0;i<fileUrls.length;++i) {
  var url = fileUrls[i];
  var x = [];//new Array();

  var f;
  (function(url){
    f = function(){
      displayFile(url, 'image', null, ft_id, null, null, null, null, !MA.isiOS());
    };
  })(url);

  x = [url, f , 
    function(e){
      if(DEBUG) console.log('Error creating gallery thumbnail');
      alert('There was a problem creating a thumbnail');
      MA.hideMessage();
    }
  ];
  newArray.push(x);
}