This is an old revision of the document!

For In vs For Of

The for…in and for…of loops are used to iterate over the properties of objects or elements of an iterable, but they do it in different ways.

For In

The for…in loop iterates over all enumerable properties of an object, including inherited ones. It gives you the keys (property names) of the object.

Example with an Object

const obj = {a: 1, b: 2, c: 3};
 
for (const key in obj) {
  console.log(key, obj[key]); // Logs 'a 1', 'b 2', 'c 3'
}

Example with an array

const arr = [10, 20, 30];
arr.foo = 'bar';
 
for (const key in arr) {
  console.log(key, arr[key]); // Logs '0 10', '1 20', '2 30', 'foo bar'
}

Be cautious using for…in with arrays, as it will also include enumerable properties that are not indices.
Example:

const numbers = [4, 8, 15, 16, 23, 42];
numbers.foo = "I'm a property, not a number!";
 
for (const key in numbers) {
  console.log(`key = ${key}, numbers[${key}] = ${numbers[key]}`);
}
 
// Output will be:
// key = 0, numbers[0] = 4
// key = 1, numbers[1] = 8
// key = 2, numbers[2] = 15
// key = 3, numbers[3] = 16
// key = 4, numbers[4] = 23
// key = 5, numbers[5] = 42
// key = foo, numbers[foo] = I'm a property, not a number!

for…in loop also iterates over the foo property, which is why this loop type must be used with caution when working with arrays.

Med Java

Table of Contents

For In vs For Of

For In

Example with an Object

Example with an array