Chyba při procházení pole cyklem for-in v JavaScriptu

K procházení pole by měl být použit cyklus for-of. Někdy však začátečníci chybně zkusí použít cyklus for-in. Podívejme se na charakteristické znaky této chyby.

Předpokládejme, že máme pole:

let arr = ['a', 'b', 'c'];

Pojďme projít prvky tohoto pole a zapsat je do jednoho řetězce.

Jistý programátor již tento úkol vyřešil, ale chybně použil cyklus for-in. Podívejme se, co se mu povedlo:

let res = '';

for (let elem in arr) {
	res += elem;
}

console.log(res); // vypíše '012'

Takže ve výsledku dostaneme řetězec '012', a ne 'abc'. Pojďme zjistit, proč k tomu došlo.

Proč se pole vůbec procházelo pomocí cyklu for-in? Jde o to, že pole v JavaScriptu je speciálním případem objektu. Takže ve skutečnosti v tomto ohledu je to korektní kód. Ale takto by se to dělat nemělo.

Jde o to, že for-in za určitých podmínek může zachytit něco navíc, a kromě prvků pole dostanete při procházení ještě něco parazitního. Pole procházejte pouze pomocí for-of.

Pojďme nyní zjistit, proč vidíme takový podivný výsledek. Jde o to, že při procházení pomocí for-in se do proměnné elem ve skutečnosti budou dostávat klíče, navzdory zavádějícímu názvu této proměnné.

Pojďme opravit provedenou chybu a napsat korektní kód:

let arr = ['a', 'b', 'c'];
let res = '';

for (let elem of arr) {
	res += elem;
}

console.log(res); // vypíše 'abc'