In a tutorial I saw the following:
Array.from( template.querySelectorAll('.hw-text') )
.forEach( n => n.textContent = hwMsg );
But the following line would also work.
template.querySelectorAll('.hw-text')
.forEach( n => n.textContent = hwMsg );
Now I wonder why in the tuturial Array.from is used and what advantage you get from it.
forEach was not part of the original NodeList specification. Browser support for querySelectorAll and Array.from is wider than for forEach on NodeLists.
Whether that additional browser support is worth it today is partly a matter of opinion and partly dependant on the website's target audience.
Element.querySelectorAll() returns a NodeList this object has a method called forEach which lets you to iterate over its items.
that same NodeList Object has length property, so you can pass it to Array.from which will return back an array, so you have access to all array methods and that's why they used it in the tutorial.
Not sure about the tutorial intention, but you can not call array functions on the NodeList object returned by querySelectorAll().
document.querySelectorAll('.hw-text').map( ... ) // throws error
[...document.querySelectorAll('.hw-text')].map( ... ) // works just fine
Array.from(document.querySelectorAll('.hw-text')).map( ... ) // works just fine