NodeList

Objetos NodeList são coleções de nodos semelhantes aos objetos retornados pelos métodos Node.childNodes e document.querySelectorAll().

Nota: Apesar de NodeList não ser um Array, é possível ser iterada usando o método forEach(). Muitos navegadores antigos ainda não implementaram este método.

Em alguns casos, NodeList é uma coleção viva, ou seja, toda alteração feita no DOM reflete nos elementos da coleção. Por exemplo, Node.childNodes é uma coleção viva:

var parent = document.getElementById("parent");
var child_nodes = parent.childNodes;
console.log(child_nodes.length); // let's assume "2"
parent.appendChild(document.createElement("div"));
console.log(child_nodes.length); // should output "3"

Já em outros casos NodeList é um coleção estática, significando que toda alteração subsequente ao DOM não afeta o conteúdo da coleção. document.querySelectorAll() é um exemplo de método que retorna uma NodeList estática.

É aconselhável lembrar dessa distinção quando for escolher como iterar sobre os itens de uma NodeList, e como você faz o cache do tamanho dessa lista.

Propriedades

NodeList.length (en-US): A quantidade de nodos na NodeList.

Métodos

NodeList.item() (en-US): Retorna um item da lista pelo índice, ou null se o índice for inválido; pode ser usado como uma alternativa a nodeList[idx] (que retorna undefined quando idx é inválido).
NodeList.entries() (en-US): Retorna um iterador que permite passar por todos os pares chave/valor contidos no objeto.
NodeList.forEach() (en-US): Executa uma função recebida uma vez para cada elemento no NodeList.
NodeList.keys() (en-US): Retorna um iterador que permite passar por todas as chaves dos pares chave/valor contidos no objeto.
NodeList.values() (en-US): Retorna um iterador que permite passar por todos os valores dos pares chave/valor contidos no objeto.

Exemplo

É possivel iterar sobre os items de um NodeList usando:

for (var i = 0; i < myNodeList.length; ++i) {
  var item = myNodeList[i]; // Calling myNodeList.item(i) isn't necessary in JavaScript
}

Não caia na tentação de usar for...in ou for each...in para enumerar os items de uma lista, já que também serão enumeradas as propriedades length e item da NodeList, o que causará erros se o seu script assumir que processará apenas objetos element. Não esquecendo que for..in não garante a iteração nas propriedades de forma ordenada.

for...of (en-US) iterará sobre os objetos da NodeList de maneira correta:

var list = document.querySelectorAll("input[type=checkbox]");
for (var item of list) {
  item.checked = true;
}

Navegadores modernos suportam métodos de iteração, forEach() (en-US), bem como entries() (en-US), values() (en-US), e keys() (en-US)

Há também um jeito compatível com o Internet Explorer de usar Array.prototype.forEach para iteração.

var list = document.querySelectorAll("input[type=checkbox]");
Array.prototype.forEach.call(list, function (item) {
  item.checked = true;
});

NodeList prototype

Você também pode adicionar protótipos para NodeList:

var elements = document.querySelectorAll(".suggestions");

NodeList.prototype.addEventListener = function (event, func) {
  this.forEach(function (content, item) {
    content.addEventListener(event, func);
  });
};

function log() {
  console.log(this, " was clicked");
}

elements.addEventListener("click", log);
//or
elements.addEventListener("click", function () {
  console.log(this, "  awas clicked");
});
// output from both will be element was clicked the element would be HTML Element

Para mais informações sobre forEach veja Array.prototype.forEach.

Especificações

Specification
DOM Standard # interface-nodelist

Compatibilidade com navegadores

BCD tables only load in the browser