在 JavaScript 中，有些对象看起来像是数组，但实际上并不具有完整的数组功能，这就是所谓的类数组对象。本文将介绍类数组对象的定义、常见特征和如何将其转换为真正的数组。
定义
类数组对象是指一个拥有 length 属性且属性名为非负整数的普通对象。这样的对象经常出现在 DOM 操作中，比如通过 document.querySelectorAll() 返回的 NodeList 对象以及表单元素的 form.elements 属性返回的 HTMLCollection 对象等。
----- -------- - --------------------------------- -- -------- ----------------------------- -- - ----- ------------ - --------------------------- -- -------------- --------------------------------- -- -
特征
虽然类数组对象看起来像是数组，但它们与真正的数组还是有一些区别的，比如：
- 类数组对象没有数组原型链上的方法，如
push()、pop()等； - 类数组对象不能使用数组语法访问元素，如
arr[0]； - 类数组对象可以被遍历，但需要使用
for...of或Array.from()转换后再使用forEach()、map()等数组方法。
----- -------- - --------------------------------- -- -------------- -- ------------------------- -- --------- -- -- -------- ------- --- ------ ---- -- --------- - -------------------------- - -- -- ------------ ------------------ ----------------------------------- ------ -- - ------------------ -------------- ---
转换为数组
如果我们想要对类数组对象使用数组原型链上的方法，或者使用数组语法访问元素，就需要将其转换为真正的数组。有多种方式可以实现类数组对象转换为数组，下面是一些常见的方法。
1. Array.from()
Array.from() 可以将一个可迭代对象或类数组对象转换为数组。它接受两个参数：第一个参数是要转换的对象，第二个参数是一个可选回调函数，用于在转换过程中对每个元素进行处理。
----- -------- - --------------------------------- -- -- ------------ - -------- ----- ----- --- - --------------------- -------------------------------- -- ----
2. Spread Operator
ES6 中的扩展运算符（Spread Operator）也可以将类数组对象转换为数组。
----- -------- - --------------------------------- -- -------- -------- ----- ----- --- - -------------- -------------------------------- -- ----
3. Array.prototype.slice.call()
Array.prototype.slice.call() 方法可以在类数组对象上调用 Array.prototype.slice 方法，并将结果返回为一个新数组，从而实现将类数组对象转换为数组。
----- -------- - --------------------------------- -- -- ------------ - -------- ----- ----- --- - ------------------------------------- -------------------------------- -- ----
结语
了解和掌握类数组对象的特征和转换方法，在前端开发中是非常重要的一部分。希望本文能够对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/28642