Diferencias entre NodeList y Array

1. No puede usar los métodos de Array más comunes como push(), pop(), slice(), join(), etc.

   <aside> 💡 Para poder usarlos primero debemos convertirlo en un Array.

   </aside>

2. NodeList puede ser una colección en vivo con la propiedad Node.childNodes. Es decir que este se altera si el DOM tiene cambios.

   <aside> 💡 El método querySelectorAll() devuelve un NodeList estático. Es decir si alteramos el DOM no se modifica nuestra colección.

   </aside>

3. querySelectorAll() no es una API de JavaScript sino una API del navegador.

Pasar un NodeList a Array

Una de las formas de hacer esto es con el spread operator.

const nodeList = document.querySelectorAll("selector-css");
const elementList = [...nodeList];

<aside> 💡 Recomendación importante cada vez que obtengamos un NodeList pásemelo a Array ya que los motores de javascript como el motor V8 de google están mas optimizados para Arrays que para NodeList.

</aside>

Archivos de la Clase