Convertir un objeto de lista HTML a un Array utilizable (JavaScript)

¡Hola!

Sin muchos rodeos, vamos al punto. Es seguro que te has encontrado con lo siguiente mientras codeas:

Esto que nos presenta el DevTools dice lo siguiente: HTMLCollection y eso lo que quiere decir es que al nosotros hacer un .log u obtener una colección de un hijo o elemento padre estamos obteniendo una colección como OBJETO.

Ahora bien, cómo nosotros podemos convertir este objeto que en lo particular a mi casi no me sirvió de nada a menos que fuera un arreglo, o en programación: Array.

Para convertir esta colección, pongamos primero un ejemplo:
vamo de:

var lista = document.querySelector("ul"); // Declaramos la variable
console.log(lista.children); // Obtenemos el objeto hijo / HTMLCollection

/*Convirtamos entonces esa colección a un arreglo. ¿Cómo? */
> Array.from(lista.children)
// Es bien simple.
/* Ahora pongamoslo en el DevTools para luego utilizar algún metodo en dicho array */
> console.log(Array.from(lista.children));

Con esto podemos entonces concluir con una lista en formato de arreglo e incluso ver los métodos disponibles para ser usados en dicho arreglo, por ejemplo en este caso, yo quiero usar el método filter, y así sucesivamente.

El resto está en tus manos