current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 19 down vote favorite
5

Why my for for-each loop is not iterating over my JavaScript associative array object?

// defining an array
var array = [];

// assigning values to corresponding keys
array["Main"] = "Main page";
array["Guide"] = "Guide page";
array["Articles"] = "Articles page";
array["Forum"] = "Forum board";

// expected: loop over every item,
// yet it logs only "last" assigned value - "Forum"
for (var i = 0; i < array.length; i++) {
    console.log(i);
}

EDIT: jQuery each() could be helpful: https://api.jquery.com/jQuery.each/

share|improve this question
    
You create an array but then use it as a map. It looks like you want a plain object instead. –  Jon Sep 14 '13 at 17:43
2  
There's no such things as associative arrays in JS: it's either plain Array or an Object. Nothing prevents adding non-numeric properties to Array, but that doesn't make it associative - in particular, length property won't auto-count these properties. –  raina77ow Sep 14 '13 at 17:44
    
re: There's no such things as associative arrays in JS. -- worded another way: JavaScript uses the name "Object" instead of the name "associative array". But it doesn't have a ".length" property. –  Jesse Chisholm Jun 16 at 20:42

1 Answer 1

up vote 35 down vote accepted

The .length property only tracks properties with numeric indexes (keys). You're using strings for keys.

You can do this:

var arr_jq_TabContents = {}; // no need for an array

arr_jq_TabContents["Main"] = jq_TabContents_Mian;
arr_jq_TabContents["Guide"] = jq_TabContents_Guide;
arr_jq_TabContents["Articles"] = jq_TabContents_Articles;
arr_jq_TabContents["Forum"] = jq_TabContents_Forum;

for (var key in arr_jq_TabContents) {
    console.log(arr_jq_TabContents[key]);
}

To be safe, it's a good idea in loops like that to make sure that none of the properties are unexpected results of inheritance:

for (var key in arr_jq_TabContents) {
  if (arr_jq_TabContents.hasOwnProperty(key))
    console.log(arr_jq_TabContents[key]);
}
share|improve this answer
    
Whats this var arr_jq_TabContents = {};? I mean {} –  Ultra Sep 14 '13 at 17:49
    
@Ultra it is an empty object literal. It just means that the variable is initialized with a reference to a new empty object. –  Pointy Sep 14 '13 at 17:50
    
@Ultra you don't need an Array instance because in that code you're not using it like a JavaScript array. JavaScript does not have "associative arrays" like some other languages. –  Pointy Sep 14 '13 at 17:51
1  
What is the difference between assigning [] and {}? Only the different prototypes? –  SoonDead Mar 10 at 15:34
2  
Instead of using hasOwnProperty it should be possible in all modern web browsers to iterate over the keys of an object using: Object.keys(arr_jq_TabContents).forEach( function(key) { ... } ); –  Gregory Bell Mar 24 at 21:13

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.