js将类数组对象转换成数组对象

将类数组对象转换成数组是 JavaScript 中常见的操作，类数组对象通常具有数字索引以及 length 属性，但不具有数组的一些操作方法。下面是将类数组对象转换成数组对象的完整攻略。

方法一：使用 Array.from()

可以使用 Array.from() 方法将类数组对象转换成一个新的数组。Array.from() 接受一个类数组对象或可迭代对象，并返回一个新的数组。

const nodeList = document.querySelectorAll('div'); //获取 DOM 元素
const divArray = Array.from(nodeList);            //将 DOM 转换成数组
console.log(divArray);

上面的代码通过 document.querySelectorAll 获取到页面中所有的 div 元素，然后使用 Array.from() 方法将 NodeList 转换成数组。转换后，可以使用数组的各种方法来操作这个数组，比如使用 forEach() 遍历数组。

divArray.forEach(element => {
  console.log(element);
});

方法二：使用 Array.apply()

也可以使用 Array.prototype.slice.call() 或者 Function.prototype.call() 方法将类数组对象转换成数组，但这些方法实现起来相对繁琐。简单来说，就是通过借用数组 slice 方法，将数组的原型方法应用在类数组对象上，从而得到一个新的数组。

const nodeList = document.querySelectorAll('div'); //获取 DOM 元素
const divArray = Array.prototype.slice.call(nodeList);  //使用 slice 方法将 NodeList 转换成数组
console.log(divArray);

上面的代码同样是将 NodeList 转换成数组，并将转换后的数组打印到控制台中。这里借用了 slice 方法，并将其应用在 nodeList 上，作用与 Array.from() 相同。

以上就是两种将类数组对象转换成数组对象的方法及示例。这种操作在前端开发中非常常见，掌握这种技能对于前端开发人员来说是非常必要的。