How to loop thru this kind of array and get the label or name of each element

Question

I have this array: I don't know what kind of array this is.

var catz ={
cafe:{class:'orange',color:'E6674A',font:'000'},
bar:{class:'orange',color:'E6674A',font:'000'},
restaurant:{class:'green',color:'a8e52f',font:'000'}
};

and I'm trying to alert the category: Ex. it should alert: cafe, then bar, and then restaurant.

for (var j = 0;j < 3;j++){
    alert (catz[j]);
}

then I'd like to also get the color

it works with this array, but I'm using the other array.

var catz = ["cafe", "bar", "restaurant"];

Thanks

It's called an object. Actually what you have is an object full of objects. — Andy, Jan 28 '14 at 15:36
If you'd read a basic JavaScript tutorial, you'd learn about the `for-in` statements used for objects. — cookie monster, Jan 28 '14 at 15:38
...and IMO, don't use `.hasOwnProperty()` as the answers below are showing. Only use it when you know you need it. — cookie monster, Jan 28 '14 at 15:40
I dont understand why people are getting obsessed of `hasOwnProperty()`, they are trying to make it **fancy**, even if this is not required. — Ashish Kumar, Jan 28 '14 at 15:56

score 2 · Answer 1 · answered Jan 28 '14 at 15:38

You can iterate over properties of an object using a for in loop.

for (var key in catz) {
    if (catz.hasOwnProperty(key))
        console.log(key, catz[key]);
}

Console output:

cafe Object {class: "orange", color: "E6674A", font: "000"}
bar Object {class: "orange", color: "E6674A", font: "000"}
restaurant Object {class: "green", color: "a8e52f", font: "000"}

score 2 · Answer 2 · edited May 23 '17 at 10:25

2

walk through the object and retrieve the keys

for (category in catz) {
   if (catz.hasOwnProperty(category)) {
      console.log(category)
   }
}

Note: in your specific example the if statement could not be really necessary (see this answer - comment included - for further information)

edited May 23 '17 at 10:25

Community

1
1

answered Jan 28 '14 at 15:38

Fabrizio Calderan

120,726
26
164
177

score 2 · Accepted Answer · answered Jan 28 '14 at 15:40

try this:

var catz ={
    cafe:{class:'orange',color:'E6674A',font:'000'},
    bar:{class:'orange',color:'E6674A',font:'000'},
    restaurant:{class:'green',color:'a8e52f',font:'000'}
};

for(var key in catz){
    alert(key + " : " + catz[key].color);
}

this will alert cafe : E6674A, and so on...

http://jsfiddle.net/ashishanexpert/qVp5u/

How to loop thru this kind of array and get the label or name of each element

3 Answers3