JavaScript - for...in & for...of

Overview

Estimated time: 20–30 minutes

for...in iterates enumerable property keys; for...of iterates values of iterables (arrays, strings, Maps, etc.).

Learning Objectives

• Choose for...in for object keys and for...of for values.
• Use Object.keys/values/entries for predictable order.

Prerequisites

• JavaScript - While & Do...While

Examples

// for...in (keys)
const obj = { a:1, b:2 };
for (const k in obj) {
  console.log(k, obj[k]);
}

// for...of (values)
for (const v of [10,20,30]) {
  console.log(v);
}

// Map iteration (entries)
const m = new Map([["x",1],["y",2]]);
for (const [k,v] of m) {
  console.log(k, v);
}

Common Pitfalls

• for...in walks inherited enumerable keys; guard with Object.hasOwn or use Object.keys.