NodeList 现在在所有主要浏览器中都有 forEach()

请参阅MDN 上的 nodeList forEach()。

原答案

这些答案都没有解释为什么NodeList 不从 Array 继承，从而允许它拥有forEach和所有其他的。

答案可在此 es-discuss thread 上找到。简而言之，它打破了网络：

问题是代码错误地假定 instanceof 意味着该实例是一个与 Array.prototype.concat 结合的数组。

Google 的 Closure Library 中存在一个错误，导致几乎所有 Google 的应用程序都因此而失败。该库在发现后立即更新，但可能仍然存在与 concat 结合使用相同错误假设的代码。

也就是说，一些代码做了类似的事情

if (x instanceof Array) {
  otherArray.concat(x);
} else {
  doSomethingElseWith(x);
}

但是，concat将“真实”数组（不是 instanceof Array）与其他对象区别对待：

[1, 2, 3].concat([4, 5, 6]) // [1, 2, 3, 4, 5, 6]
[1, 2, 3].concat(4) // [1, 2, 3, 4]

所以这意味着上面的代码在x是 NodeList时中断了，因为在它沿着doSomethingElseWith(x)路径走之前，而之后它沿着otherArray.concat(x)路径走，这做了一些奇怪的事情，因为x它不是一个真正的数组。

一段时间以来，有人提议将一个Elements类作为 Array 的真正子类，并将用作“新的 NodeList”。但是，这已从 DOM Standard 中删除，至少目前是这样，因为由于各种技术和规范相关的原因，它尚不可行。

你可以做

Array.prototype.forEach.call (nodeList, function (node) {

    // Your code here.

} );

您可以考虑创建一个新的节点数组。

  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.  

  });

注意：这只是我们在这里创建的节点引用列表/数组，没有重复的节点。

  nodes[0] === nodeList[0] // will be true

永远不要说永远，现在是 2016 年，NodeList对象已经forEach在最新的 chrome (v52.0.2743.116) 中实现了一个方法。

现在在生产中使用它为时过早，因为其他浏览器尚不支持此功能（已测试 FF 49），但我猜这将很快标准化。

简而言之，实现该方法存在设计冲突。

来自 MDN：

为什么我不能在 NodeList 上使用 forEach 或 map？

NodeList 的使用与数组非常相似，并且很容易在它们上使用 Array.prototype 方法。然而，这是不可能的。

JavaScript 具有基于原型的继承机制。数组实例继承数组方法（例如 forEach 或 map），因为它们的原型链如下所示：

myArray --> Array.prototype --> Object.prototype --> null （一个对象的原型链可以通过多次调用Object.getPrototypeOf获得）

forEach、map 等都是 Array.prototype 对象的属性。

与数组不同，NodeList 原型链如下所示：

myNodeList --> NodeList.prototype --> Object.prototype --> null

NodeList.prototype 包含 item 方法，但不包含 Array.prototype 方法，因此它们不能用于 NodeLists。

来源：https : //developer.mozilla.org/en-US/docs/DOM/NodeList（向下滚动到为什么我不能使用 forEach 或在 NodeList 上映射？）