16

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?

Improve this question

3 Answers 3

Reset to default
30

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.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

All I needed to know, I guess I missed some lessons :).
Glad I could help. It is a little confusing, just because the square-bracket syntax does two completely different things on Array objects!
The jQuery.each() function you linked above is not the same function used by the OP in his example. He uses $(cells).each(...), which is intended for use on jquery-sets of DOM elements, not on generic 'collections' (objects/arrays). I'm not saying it won't work as-is, but a truly complete answer would point out the distinction - or at least link to the docs that match the function being used by the OP. (Other than that though, good answer).
9

You seem to be thinking Javascript's arrays are associative, which is not the case. You're probably looking for objects (or hashes) instead:

var cells = {};         // Not [].
$("td").each(function() {
    var td = $(this);
    cells[td.attr("id")] = td;
});

$.each(cells, function() {
    console.log(this);  // This should work as expected.
});
Improve this answer

4 Comments

Not to be pedantic, but JavaScript doesn't have a data type called "hash." It has Objects, which happen to have an object literal syntax which looks a lot like hashes in other languages. var cells = {}; merely creates an object with no properties (aside from those inherited from Object.prototype).
@Jordan, you're absolutely right, for some reason I thought that "hashes" was easier to understand than "objects" in our context. I updated my answer to use both terms.
Thank you for the answer, I accepted Jordan's because of his explanation of how my wrong assumptions affected the .each method.
@Przemek, no problem, you did well, his answer is very good :)
6

use $.each(cells, function(i) { ... }) instead of $(cells).each(function...)

The $.each() function is different from the $(selector).each function.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.