Question

147

Iterating an associative array with jQuery .each

rated 0 times [ 150] [ 3] / answers: 1 / hits: 15869 / 13 Years ago, thu, october 6, 2011, 12:00:00

Probably the most contributing factor for this question is that I am extremely sleepy right now.

I have an array, which I initiate:

var cells = [];

Then i put some values in it (jQuery objects), for example:

$(td).each(function () {

  var td = $(this);

  cells[td.attr(id)] = td;

});

And now my problem. This code:

$(cells).each(function (i) {

  console.log(this) // firebug console

});

logs absolutelly nothing. When i changed the associative array to a normal, number index one by substituting

cells[td.attr(id)] = td;

with

cells.push(td);

It worked correctly.

Also, when I try to iterate with the for..in loop it works as expected.

for (var cell in cells) {

  console.log(cells[cell]);

}

Doeas that mean that jQuery's .each method does not accept associative arrays or am I doing something wrong?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

guadalupec

Add To Favorites

Follow

Total Points: 610

Total Questions: 91

Total Answers: 91

Location: Guernsey

Member since Tue, Jul 6, 2021

3 Years ago

answered 13 Years ago myrap · Accepted Answer

JavaScript does not have associative arrays. It has Arrays and it has Objects, and arrays happen to be objects. When you do this:

var a = [];

a['foo'] = 'bar';

..you're actually doing the equivalent of this:

var a = [];

a.foo = 'bar';

// ^--- property of object 'a'

That is to say you're actually adding a property called foo to the object a, not adding an element to the array a.

From the documentation for jQuery.each():

Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.

Since you created an Array ([]) jQuery looks at its length property, and since you have not added any elements to the array (only properties on the object, remember) its length is still zero and so jQuery (correctly) does nothing.

What you want to do instead, as others have noted, is create an Object using e.g. var cells = {};. Since a non-Array object has no length property (not by default, anyway) jQuery will know that you really want to iterate over its properties instead of numeric indices as in an Array.