How to Traverse Array of Objects and Access the Properties in JavaScript?

Last Updated : 07 Apr, 2025

Here are the various methods to traverse an array of objects and access the properties in JavaScript

1. Using for…in loop

The for...in loop is used to iterate over the enumerable properties of an object.

JavaScript

const a = [
    {name: 'Saritha', sub: 'Maths'},
    {name: 'Sarthak', sub: 'Science'},
    {name: 'Sneha', sub: 'Social'}
]

a.forEach(teacher => {
    for (let value in teacher) {
        console.log(`${teacher[value]}`)
    }
})

Output

Saritha
Maths
Sarthak
Science
Sneha
Social

In this example:

forEach() goes through each object in the array.
for...in loops through the properties (name, sub) of each teacher object.
teacher[value] accesses and logs the value of each property.

2. Using forEach() Method

The forEach() method executes a provided function once for each array element.

JavaScript

const a = [{ x:1 }, { x: 2 }, { x: 3 }];

a.forEach((element, index, array) => {
    console.log(element.x);    
});

Output

1
2
3

In this example:

forEach() is used to iterate over each object in the arr.
element represents the current object (e.g., { x: 1 }, { x: 2 }).
element.x accesses and logs the x property of each object.

3. Using Object.keys() Method

Object.keys() returns an array of a given object's own enumerable property names (keys).

JavaScript

const a = [
    {name: 'Saritha', sub: 'Maths'},
    {name: 'Sarthak', sub: 'Science'},
    {name: 'Sneha', sub: 'Social'}
]

for (let teacher in a) {
    for (let key in a[teacher]) {
        console.log(a[teacher][key]);
    }
}

Output

Saritha
Maths
Sarthak
Science
Sneha
Social

In this example:

The outer for...in loop iterates over the array, where each teacher is the index of an object in the array.
The inner for...in loop iterates over the keys (name, subject) of each teacher object.
a[teacher][key] accesses and logs the value of each property (like 'Saritha', 'Maths', etc.).

4. Using object.values() Method

Object.values() returns an array of a given object's own enumerable property values.

JavaScript

const a = [
    {name: 'Saritha', sub: 'Maths'},
    {name: 'Sarthak', sub: 'Science'},
    {name: 'Sneha', sub: 'Social'}
]

for (const value of Object.values(a)) {
    for (let v in value) {
        console.log(value[v]);
    }
}

Output

Saritha
Maths
Sarthak
Science
Sneha
Social

In this example:

Object.values(a) returns an array of the teacher objects.
for...of loops through each teacher object.
for...in loops over the properties (name, subject) of each teacher object.
value[v] accesses and logs the values of the properties (name and subject).

5. Using the object.entries() Method

The Object.entries() method in JavaScript returns an array consisting of enumerable property [key, value] pairs of the object.

JavaScript

const a = [
    {name: 'Saritha', sub: 'Maths'},
    {name: 'Sarthak', sub: 'Science'},
    {name: 'Sneha', sub: 'Social'}
]

for (const entry of Object.entries(a)) {
    for (let value in entry[1]) {
        console.log(entry[1][value]);
    }
}