In this tutorial, you will learn about the JavaScript for…in loop with the assistance of examples.
Javascript is quite possibly the most famous programming language on the planet. In any programming language, loops have a fundamental worth. In the same way as other different languages, Javascript gives distinctive loop syntax formats, also. This article examines a significant Javascript topic known as the for… in loop.
In the previous tutorials, we have covered:
There are likewise different types of loops. The for..in loop in JavaScript allows you to repeat over all property keys of an object.
In this article, you will learn-
JavaScript for…in loop
The syntax of the for…in loop is:
for (key in object) { // body of for...in }
In every iteration of the loop, a key is allowed to the key variable. The loop proceeds for all object properties.
Note: Once you get keys, you can undoubtedly discover its worth.
Example 1: Iterate Through an Object
const student = { name: 'Sara', class: 7, age: 12 } // using for...in for ( let key in student ) { // display the properties console.log(`${key} => ${student[key]}`); }
Output
name => Sara class => 7 age => 12
In the above program, the for…in loop is used to iterate over the student object and print every one of its properties.
- The object key is appointed to the variable key.
- student[key] is used to get to the value of the key.
Example 2: Update Values of Properties
const salaries= { Salman : 24000, Sohail : 34000, Sara : 55000 } // using for...in for ( let i in salaries) { // add a currency symbol let salary = "$" + salaries[i]; // display the values console.log(`${i} : ${salary}`); }
Output
Salman : $24000, Sohail : $34000, Sara : $55000
In the above example, the for…in loop is used to repeat over the properties of the salaries object. At that point, the string $ is added to each value of the object.
for…in with Strings
You can also use for…in loop to iterate over string values. For example,
const string = 'code'; // using for...in loop for (let i in string) { console.log(string[i]); }
Output
c o d e
for…in with Arrays
You can likewise use for…in with arrays. For instance,
// define array const arr = [ 'hello', 1, 'JavaScript' ]; // using for...in loop for (let x in arr) { console.log(arr[x]); }
Output
hello 1 JavaScript
You will learn more about the arrays in later tutorials.
Note: You ought not to use for…in to iterate over an array where the index order is significant.
One of the better approaches to iterate over an array is using the for…of loop.
Thanks for reading! We hope you found this tutorial helpful and we would love to hear your feedback in the Comments section below. And show us what you’ve learned by sharing your photos and creative projects with us.