JavaScript For In

The JavaScript for in statement loops through the properties of an Object

The For In Loop

The JavaScript for in statement loops through the properties of an Object:

Syntax

for (key in object) {
  // code block to be executed
}

Example

const person = {fname:"John", lname:"Doe", age:25};

let text = "";
for (let x in person) {
  text += person[x];
}

Example Explained

  • The for in loop iterates over a person object
  • Each iteration returns a key (x)
  • The key is used to access the value of the key
  • The value of the key is person[x]
  • For In Over Arrays

    The JavaScript for in statement can also loop over the properties of an Array:

    Syntax

    for (variable in array) {
      code
    }

    Example

    const numbers = [45, 4, 9, 16, 25];

    let txt = "";
    for (let x in numbers) {
      txt += numbers[x];
    }

    Do not use for in over an Array if the index order is important.

    The index order is implementation-dependent, and array values may not be accessed in the order you expect.

    It is better to use a for loop, a for of loop, or Array.forEach() when the order is important.

    Array.forEach()

    The forEach() method calls a function (a callback function) once for each array element.

    Example

    const numbers = [45, 4, 9, 16, 25];

    let txt = "";
    numbers.forEach(myFunction);

    function myFunction(value, index, array) {
      txt += value;
    }

    Note that the function takes 3 arguments:

  • The item value
  • The item index
  • The array itself
  • The example above uses only the value parameter. It can be rewritten to:

    Example

    const numbers = [45, 4, 9, 16, 25];

    let txt = "";
    numbers.forEach(myFunction);

    function myFunction(value) {
      txt += value;
    }