Ошибка обращения к массиву элементов в JavaScript

Иногда начинающие программисты пытаются работать с массивом элементов будто у них один элемент. Давайте посмотрим, в чем суть этой ошибки.

Пусть даны абзацы:

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

Пусть некий программист решил записать в текст каждого абзаца одно и тоже значение. Для этого он получил ссылки на эти элементы в переменную:

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

Затем наш программист ошибочно взял и обратился в нашей переменной так, будто там лежит один элемент, а не массив. В результате текст абзацев не изменится, но, что характерно, и ошибки в консоли не будет:

elems.textContent = '!';

Правильным решением здесь будет перебрать массив элементов циклом и для отдельно для каждого элемента выполнить нужную операцию:

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