in , ,

JavaScript for…in loop

JavaScript for…in loop
JavaScript for…in loop

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 forin 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.


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.

salman khan

Written by worldofitech

Leave a Reply

JavaScript String

JavaScript String

JavaScript Number

JavaScript Number