Iterables and for...of Loop in JavaScript

An iterable is any object that can be looped over – like arrays and strings. The for...of loop is the modern, clean way to iterate over values in iterables.

This is different from for...in, which loops over property names (keys).

The for...of Loop

Gives you each value directly – no need for index.

Strings Are Iterable

Maps and Sets

Map iterates over entries, Set over unique values.

for...in – For Object Properties

for...in loops over enumerable property names (keys) – mainly for objects.

Avoid for...in on arrays – it loops over indices as strings and can include inherited properties.

When to Use Which Loop

• for – known number of iterations, need index.
• while/do-while – condition-based, unknown repetitions.
• for...of – clean value iteration over iterables.
• for...in – object property enumeration.

Quick Quiz