Σφάλμα πρόσβασης σε πίνακα στοιχείων σε JavaScript

Μερικές φορές οι αρχάριοι προγραμματιστές προσπαθούν να δουλέψουν με έναν πίνακα στοιχείων σαν να έχουν ένα μόνο στοιχείο. Ας δούμε ποια είναι η ουσία αυτού του σφάλματος.

Ας υποθέσουμε ότι δίνονται παράγραφοι:

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

Ας υποθέσουμε ότι κάποιος προγραμματιστής αποφάσισε να γράψει στο κείμενο κάθε παραγράφου την ίδια τιμή. Για αυτό, πήρε αναφορές σε αυτά τα στοιχεία σε μια μεταβλητή:

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

Στη συνέχεια, ο προγραμματιστής μας πήρε λανθασμένα και προσέγγισε τη μεταβλητή μας σαν να περιείχε ένα μόνο στοιχείο, και όχι έναν πίνακα. Ως αποτέλεσμα, το κείμενο των παραγράφων δεν θα αλλάξει, αλλά, χαρακτηριστικά, ούτε θα υπάρξει σφάλμα στην κονσόλα:

elems.textContent = '!';

Η σωστή λύση εδώ θα ήταν να διατρέξουμε τον πίνακα των στοιχείων με έναν βρόχο και για κάθε στοιχείο ξεχωριστά να εκτελέσουμε την απαιτούμενη λειτουργία:

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