Fel vid iteration av array med for-in-loop i JavaScript

För att iterera genom en array bör man använda en for-of-loop. Ibland försöker dock nybörjare felaktigt använda en for-in-loop. Låt oss titta på de karakteristiska tecknen på detta fel.

Låt oss säga att vi har en array:

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

Låt oss iterera genom elementen i denna array och skriva dem till en enda sträng.

En viss programmerare har redan löst detta problem, men använde felaktigt en for-in-loop. Låt oss se vad han fick:

let res = '';

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

console.log(res); // kommer att skriva ut '012'

Så, resultatet blir strängen '012', och inte 'abc'. Låt oss ta reda på varför detta hände.

Varför gick det överhuvudtaget att iterera arrayen med en for-in-loop? Saken är den att en array i JavaScript är ett specialfall av ett objekt. Så egentligen är det korrekt kod i detta avseende. Men man bör inte göra så här.

Anledningen är att for-in under vissa förhållanden kan fånga upp extra saker, och förutom arrayelementen får du något parasitisk under iterationen. Iterera arrayer endast med for-of.

Låt oss nu ta reda på varför vi ser ett så konstigt resultat. Saken är den, att vid iteration med for-in kommer variabeln elem faktiskt att innehålla nycklarna, trots variabelns villovägande namn.

Låt oss rätta till det begångna felet och skriva korrekt kod:

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

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

console.log(res); // kommer att skriva ut 'abc'