get data from array of Objects

Question

I am currently trying to display an array of objects as rows in an html table. I am new to javascript and I am having trouble accessing individual elements in the array.

In the console the array is: [Object, Object, Object, ... Object, Object, Object] 65 total objects.

Each object has a field called id and each object in the console shows it as follows:

0: Object

  ...

  id:   10

  ...

I tried accessing id with the following code:

for (var item in data) {
    console.log(item);
    console.log(item['id']);
}

This shows me the object number followed by a line that says undefined. I know that the data has a value because I can view it in the console but I can't access using dot notation or the above notation. Any assistance would be greatly appreciated.

@Chris...you're saying that console.log(item); show you the object number and console.log(item['id']); says undefined? — MikeTWebb, Apr 16 '13 at 18:28
Don't use `for...in` to iterate over arrays. Use a `for` loop. As you said, `item` is the *index* of object in the array, not the object itself. — Felix Kling, Apr 16 '13 at 18:28
Have a look at [Why is using “for…in” with array iteration such a bad idea?](http://stackoverflow.com/q/500504/1048572) ! — Bergi, Apr 16 '13 at 18:30
The new trend is to learn JavaScript one step at a time by asking questions on StackOverflow (and completely ignoring all online references). I highly recommend reading the [MDN documentation](https://developer.mozilla.org/en-US/docs/JavaScript) when you have questions about JavaScript. — jahroy, Apr 16 '13 at 18:34
@am not, I am learning javascript because the other day I was tasked to write something in javascript. I only know C/C++/Obj-C and python. no experience with java/javascript. trying to learn on the fly. — Chris.Stover, Apr 16 '13 at 19:47
That's not a good way to learn. It shows that you're not putting forth any real effort on your own, and is discourteous toward those who are willing to help people who have actual issues. — , Apr 16 '13 at 21:16
I disagree with your assumption that I'm not putting forth any effort. I couldn't find anything on google to solve this problem so I asked here. Are you assuming that I started from scratch and suddenly I had a array of objects? Or that I had to learn nothing to get to the point where I got stuck? I'm reading through a javascript book that I was given, it is written specifically for netscape navigator. Hopefully that gives you an idea of how old my only physical resource is. Everything else is coming from online tutorials and SO is a great resource for learning. — Chris.Stover, Apr 16 '13 at 22:09

score 5 · Accepted Answer · answered Apr 16 '13 at 18:28

When using a for..in loop, it iterates through the keys. You then need to use data[item]['id'] to get at that value.

However, you should not use a for..in loop to iterate through arrays (unless they're sparse). Instead, try this:

for( var i=0, l=data.length; i<l; i++) {
    console.log(i);
    console.log(data[i]['id']);
}

score 2 · Answer 2 · answered Apr 16 '13 at 18:28

2

You can access just using data[item].id. Infact item in for-in loop will give the index.

Ex:-

data=[
    {
        id:1
    },{
        id:2
    },{
        id:3
    },{
        id:4
    }
    ];
for(var ind in data)
{
    alert(data[ind].id);
}

answered Apr 16 '13 at 18:28

PSL

123,204
21
253
243

score 1 · Answer 3 · answered Apr 16 '13 at 18:28

1

I believe you are looking for:

for(var i=0;i<arrayname.length;i++){
...
}

answered Apr 16 '13 at 18:28

illinoistim

456
10
27

Muneeb Nasir · Answer 4 · 2013-04-16T18:37:50.360

1

you are getting undefined because your's Object contain array, and that array contain object in its indexes. format is like this:

0:obj1
1:obj2

you are trying to access object directly ignoring array index.

try this.

for(var j=0; j<data.lenght; j++){
console.log(item[j]['id']);

}

edited Apr 16 '13 at 18:37

answered Apr 16 '13 at 18:28

Muneeb Nasir

2,414
4
31
54

score 1 · Answer 5 · answered Apr 16 '13 at 18:29

Your for statement is incorrect.

Try this:

for(var item in data){
  var dataItem = data[item];

   console.log(dataItem.id);
}

Although generally, I find it better practice to use a for loop rather than for..in loop to loop through array item so this may be better:

var dLength = data.length;
for(var i=0; i<dLength; i++){
  var dataItem = data[i];

  console.log(dataItem.id);
}

orb · Answer 6 · 2013-04-16T18:55:37.200

1

If you want to see the contents of each object in the console followed by the id property for each object try this (works in at least firebug and chrome console):

for (var item in data) {
console.log("%o", data[item]);
console.log("%o", data[item][id]);

}

edited Apr 16 '13 at 18:55

answered Apr 16 '13 at 18:31

orb

1,263
1
10
16

get data from array of Objects

6 Answers6