Why doesn't nodelist have forEach?
NodeList now has forEach() in all major browsers
See nodeList forEach() on MDN.
Original answer
None of these answers explain why NodeList doesn't inherit from Array, thus allowing it to have forEach
and all the rest.
The answer is found on this es-discuss thread. In short, it breaks the web:
The problem was code that incorrectly assumed instanceof to mean that the instance was an Array in combination with Array.prototype.concat.
There was a bug in Google's Closure Library which caused almost all Google's apps to fail due to this. The library was updated as soon as this was found but there might still be code out there that makes the same incorrect assumption in combination with concat.
That is, some code did something like
if (x instanceof Array) {
otherArray.concat(x);
} else {
doSomethingElseWith(x);
}
However, concat
will treat "real" arrays (not instanceof Array) differently from other objects:
[1, 2, 3].concat([4, 5, 6]) // [1, 2, 3, 4, 5, 6]
[1, 2, 3].concat(4) // [1, 2, 3, 4]
so that means that the above code broke when x
was a NodeList, because before it went down the doSomethingElseWith(x)
path, whereas afterward it went down the otherArray.concat(x)
path, which did something weird since x
wasn't a real array.
For some time there was a proposal for an Elements
class that was a real subclass of Array, and would be used as "the new NodeList". However, that was removed from the DOM Standard, at least for now, since it wasn't feasible to implement yet for a variety of technical and specification-related reasons.
You can do
Array.prototype.forEach.call (nodeList, function (node) {
// Your code here.
} );
You can consider creating a new array of nodes.
var nodeList = document.getElementsByTagName('div'),
nodes = Array.prototype.slice.call(nodeList,0);
// nodes is an array now.
nodes.forEach(function(node){
// do your stuff here.
});
Note: This is just a list/array of node references we are creating here, no duplicate nodes.
nodes[0] === nodeList[0] // will be true