Fel vid hantering av elementarray i JavaScript

Ibland försöker nybörjarprogrammerare arbeta med en array av element som om de vore ett enda element. Låt oss se vad som är kärnan i detta misstag.

Antag att vi har följande stycken:

<p>1</p>
<p>2</p>
<p>3</p>

Antag att en programmerare bestämde sig för att skriva samma värde i texten för varje stycke. För att göra detta hämtade de referenser till dessa element till en variabel:

let elems = document.querySelectorAll('p');

Sedan tog vår programmerare felaktigt och åtkomst till variabeln som om den innehöll ett enda element, istället för en array. Som ett resultat kommer texten i styckena inte att ändras, men, karaktäristiskt nog, kommer inget fel i konsolen att visas:

elems.textContent = '!';

Den korrekta lösningen här skulle vara att iterera genom arrayen av element med en loop och för varje element individuellt utföra den nödvändiga operationen:

for (let elem of elems) {
	elem.textContent = '!';
}