HTMLCollection 是一个数组吗？答案

【问题标题】：Is HTMLCollection An Array?HTMLCollection 是一个数组吗？
【发布时间】：2012-10-07 15:32:34
【问题描述】：

我知道 HTMLCollection 实际上不是一个数组，否则它将被定义为一个数组。我使用我称为 isArray() 的帮助函数来检测对象是否为数组。我到处使用这个小助手，并且在检查 htmlCollection 时，我一直在运行返回 false 的问题。

var isArray: function(obj) {
    var type = Function.prototype.call.bind( Object.prototype.toString );
    return type(obj) === '[object Array]' || type(obj) === '[object HTMLCollection]';
}

在这个辅助函数中检查 htmlCollection 类型并假设它与数组相同，会不会出错？是什么让它与众不同？除了它的 html 元素而不是 javascript 对象。

【问题讨论】：

请注意，HTMLCollection（或实际上任何类似数组的对象）可以使用Array.prototype.slice.call(obj) 转换为真正的数组。
@lonesomeday：IE8 及更低版本除外。 :(
ryandlf：您应该重新考虑isArray 函数的设计，这样您就不会在每次调用isArray 时都创建type 函数。与只做一次然后调用它相比，这是一个相当昂贵的操作。
你应该用原生方式来检查它是否是一个数组：Array.isArray(youVariable)

标签： javascript html

【解决方案1】：

不，这是HTMLCollection，而不是Array。

它具有类似数组的特性，如数字属性和.length 属性，但它不继承自Array.prototype。因此它没有标准的Array 方法，因此应该被视为不同。

另一个显着的区别是HTMLCollection 是一个“实时”集合，这意味着它会随着 DOM 的更新而更新。如果您从 DOM 中删除其节点之一，它将自动从 HTMLCollection 中删除。

【讨论】：

明白，但在我的情况下，我正在检查一个数组，如果检查结果为真，那么我允许对元素执行类似数组的操作。任何通常在阵列上工作的功能都会失败吗？
@ryandlf：是的，它会失败。请参阅我更新的答案。他们应该被认为是完全不同的。要获得 Array 行为，您需要先将其转换为 Array。
当使用array-likes调用数组方法时，为什么javascript不会像"2" + 2时那样自动转换它？

【解决方案2】：

如果你正在考虑数组转换，请参考这篇文章：

Most efficient way to convert an HTMLCollection to an Array。

他们讨论了一些方法，所选答案中的解决方案在我经历过的情况下也有效。

【讨论】：