Jaký je rozdíl mezi JavaScripty for...in, for...of a forEach?

for...in se používá k iteraci přes všechny vyčíslitelné vlastnosti objektu, včetně zděděných vyčíslitelných vlastností. Tento iterační příkaz lze použít s řetězci polí nebo prostými objekty, ale ne s Map nebo Set objektů.

for (let prop in ['a', 'b', 'c'])
  console.log(prop);            // 0, 1, 2 (array indexes)

for (let prop in 'str')
  console.log(prop);            // 0, 1, 2 (string indexes)

for (let prop in {a: 1, b: 2, c: 3})
  console.log(prop);            // a, b, c (object property names)

for (let prop in new Set(['a', 'b', 'a', 'd']))
  console.log(prop);            // undefined (no enumerable properties)

for...of se používá k iteraci přes iterovatelné objekty, přičemž iteruje přes jejich hodnoty místo jejich vlastností. Tento iterační příkaz lze použít s poli, řetězci, Map nebo Set předměty, ale ne s obyčejnými předměty.

for (let val of ['a', 'b', 'c'])
  console.log(val);            // a, b, c (array values)

for (let val of 'str')
  console.log(val);            // s, t, r (string characters)

for (let val of {a: 1, b: 2, c: 3})
  console.log(prop);           // TypeError (not iterable)

for (let val of new Set(['a', 'b', 'a', 'd']))
  console.log(val);            // a, b, d (Set values)

Nakonec forEach() je metoda Array prototyp, který vám umožňuje iterovat prvky pole. Zatímco forEach() iteruje pouze přes pole, může při iteraci přistupovat jak k hodnotě, tak k indexu každého prvku.

['a', 'b', 'c'].forEach(
  val => console.log(val)     // a, b, c (array values)
);

['a', 'b', 'c'].forEach(
  (val, i) => console.log(i)  // 0, 1, 2 (array indexes)
);

Máte rádi krátké, vysoce kvalitní úryvky kódu a články? My též! Navštivte 30 sekund kódu pro další články, jako je tento, nebo nás sledujte na Twitteru pro denní úryvky JavaScript, React a Python! 👨‍💻