JavaScript: преобразование HTMLCollection в массив – методы и примеры

Чтобы преобразовать HTMLCollection в массив в JavaScript, вы можете использовать различные методы. Вот несколько подходов:

Метод 1: Array.from()

const htmlCollection = document.getElementsByClassName('example');
const array = Array.from(htmlCollection);

Метод 2: оператор расширения

const htmlCollection = document.getElementsByClassName('example');
const array = [...htmlCollection];

Метод 3: ручная итерация

const htmlCollection = document.getElementsByClassName('example');
const array = [];
for (let i = 0; i < htmlCollection.length; i++) {
  array.push(htmlCollection[i]);
}

Метод 4: Array.prototype.slice.call()

const htmlCollection = document.getElementsByClassName('example');
const array = Array.prototype.slice.call(htmlCollection);

Эти методы преобразуют HTMLCollection в обычный массив JavaScript, позволяя использовать методы, специфичные для массива, такие как forEach, mapи filterв преобразованном массиве.