Iterations on Objects

Ways/Methods To Loop Through Objects

For…in Loop

For…in Loop is used for iteration or repetition in JavaScript. During each iteration, you get an object key. That object key can be used to access the property value. 

Syntax

for (variable in object) {  Statement to run } You can also try this code with Online Javascript Compiler Run Code

Let’s see an example:

Program:

let human = {   first_name: 'Ken',   last_name : 'Adams',   age : '25',   mobile_no : '123456789'   };   for (let key in human) {   if(human.hasOwnProperty(key)) {   console.log(`${key} : ${human[key]}`);   } } You can also try this code with Online Javascript Compiler Run Code

The above code would result in outputting the following-

Object.keys() method

The Object.keys() method receives an object as an input and, as an output it returns an array of the object’s properties. This Object.keys() method was introduced in ES6. When we combine the Object.keys() method with the forEach(), we can access the keys and the values of an object. 

Syntax

Object.keys(obj) You can also try this code with Online Javascript Compiler Run Code

Let’s see an example:

let human = {
   first_name: 'Ken',
   last_name: 'Adams',
   age: 23,
   mobile_no: '123456789'
};
Object.keys(human).forEach(key => {
   console.log(`${key}: ${human[key]}`);
});

You can also try this code with Online Javascript Compiler

Run Code

The above code would result in outputting the following-

Object.values() method

This Object.values () method also takes an object as an input and returns an array consisting of the object’s values. Also, this method was introduced in ES7.

Syntax

Object.values(obj) You can also try this code with Online Javascript Compiler Run Code

Let’s see an example,

Program:

let human = {   first_name: 'Ken',   last_name: 'Adams',   age: 25,   mobile_no: '123456789' }; Object.values(human).forEach(value => {   console.log(`${value}`); }); You can also try this code with Online Javascript Compiler Run Code

The above code would result in outputting the following-

Object.entries() method

This Object.entries() method also takes an object as an argument and returns an array of the object’s enumerable string-key property [key, value] pairs.

Syntax

Object.entries(obj) You can also try this code with Online Javascript Compiler Run Code

Let’s see an example,

Program:

let human = {   first_name: 'Ken',   last_name: 'Adams',   age: 25,   mobile_no: '123456789' }; Object.entries(human).forEach(([key, value]) => {   console.log(`${key}: ${value}`); }); You can also try this code with Online Javascript Compiler Run Code

The above code would result in outputting the following-

Object.getOwnPropertyName() method

This Object.getOwnPropertyNames() method also accepts an object as an argument. It returns an array consisting of the object’s keys as an output, including non-enumerable properties except for those using the symbol. 

Syntax

Object.getOwnPropertyNames(obj) You can also try this code with Online Javascript Compiler Run Code

Let’s see an example,

Program:

let human = {   first_name: 'Ken',   last_name: 'Adams',   age: 25,   mobile_no: '123456789' }; Object.getOwnPropertyNames(human).forEach(key =>   console.log(`${key}: ${human[key]}`) ); You can also try this code with Online Javascript Compiler Run Code

The above code would result in outputting the following-

You can practice by yourself on the online JS editor.

Frequently Asked Questions

What is the need for iteration on objects?
 

In programming, this process is essential such that you as a programmer would be able to perform the same task upon a JavaScript iterable object type such as an array, object, etc. This essentially cuts down the line of code for a small codebase and is a lifesaver for an extensively long list of values denoted as objects.

Why does JavaScript store almost everything in objects?

That's right: almost everything in JavaScript is an object. However, these objects are not the same as those found in Java, C++, or other traditional languages. In JS, an object is just a hashmap with key-value pairs. A key is always a string or a symbol, while a value can be anything from strings to integers to booleans to functions to other objects.

Why are iterators preferred in programming languages such as JavaScript?

The iterators are unique objects bound with a collection-based data type in JavaScript, such as an array or object. As such, these iterators are capable of programmatically iterating over a list of particular objects. The “for” looping process also internally utilizes these iterators.

How can we access an object’s inbuilt methods?

You can utilize (.), i.e., dot operator, to call upon the methods embedded within a particular object in JavaScript. For instance - 

     let human { … }

     > human.functionName(args);

Conclusion

In this article, we have studied various ways and methods for iterations on objects in JavaScript. We have learned about iterations on objects. 

We hope that this article has provided you with the help to enhance your knowledge regarding boxing and unboxing in javascript and if you would like to learn more, check out our articles on JavaScript BOM, Type Conversion in JavaScript, and Objects in JavaScript. 

Refer to our guided paths on Coding Ninjas Studio to learn more about DSA, Competitive Programming, JavaScript, System Design, etc. Enroll in our courses and refer to the mock test and problems available, Take a look at the interview experiences and interview bundle for placement preparations.

Do upvote our blog to help other ninjas grow.

Merry Learning!