Erreur d'accès à un tableau d'éléments en JavaScript

Parfois, les programmeurs débutants essaient de travailler avec un tableau d'éléments comme si c'était un seul élément. Voyons en quoi consiste cette erreur.

Soit les paragraphes suivants :

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

Supposons qu'un programmeur ait décidé de mettre la même valeur dans le texte de chaque paragraphe. Pour cela, il a obtenu les références à ces éléments dans une variable :

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

Ensuite, notre programmeur a incorrectement accédé à notre variable comme si elle contenait un seul élément, et non un tableau. En conséquence, le texte des paragraphes ne changera pas, mais, chose caractéristique, il n'y aura aucune erreur dans la console :

elems.textContent = '!';

La solution correcte ici serait de parcourir le tableau d'éléments avec une boucle et pour chaque élément individuellement exécuter l'opération nécessaire :

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