for...of vs for...in

JavaScript 🟢 Junior

Definition

for...of itere sur les valeurs des iterables (Array, Map, Set, String). for...in itere sur les cles enumerables d'un objet, y compris la prototype chain.

Analogie

for...of = lire chaque page d'un livre. for...in = lire la table des matieres (et potentiellement celles des annexes heritees).

Exemple de code

const arr = ['a', 'b', 'c'];
for (const val of arr) console.log(val); // a, b, c
for (const idx in arr) console.log(idx); // 0, 1, 2

const obj = { x: 1, y: 2 };
for (const key in obj) console.log(key); // x, y

Cas d'usage

for...of pour les tableaux et iterables, for...in pour les proprietes d'objets (avec hasOwnProperty).

Anti-pattern

Utiliser for...in sur un tableau : parcourt aussi les proprietes du prototype et les index sont des strings.
#core#fondamental#interview