总结一下JavaScript中类似数组的对象转化为真正的数组的几种方法

总结一下JavaScript中类似数组的对象转化为真正的数组的几种方法

常见的类似数组的对象基本有以下几种：

let arrayLike ={
    
    
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length :3
}           
// 这种类数组是未定义遍历接口的对象

const oDiv = document.querySelectorAll('div'); // 定义了遍历器接口的对象

还有一种类数组是 函数内部的argument 对象

arguments对象不是一个 Array 。它类似于Array，但除了length属性和索引元素之外没有任何Array属性

ES5中的写法

var arr1 = [].slice.call(obj);

var arr2 = [].slice.call(obj);

var arr3 = Array.prototype.slice.call(obj);

ES6中的新方法

Array.from 方法用于将类似数组的对象和可遍历对象转为真正的数组

只要是部署了Iterator（遍历）接口的数据结构，Array.from都可以将其转为真正的数组

const arr = Array.from(obj);

对于没有定于遍历接口的对象，则不可用

const arr4 = Array.from(arrayLike)
console.log(arr4) 
// TypeError: object is not iterable 

ES6的拓展运算符

const args = [...arguments];
const arr5 = [...oDiv];

对于没有定于遍历接口的对象，则不可用

const arr6 = [...arrayLike]
console.log(arr2);  // TypeError: object is not iterable 

Array.of（）（额外补充）

这个方法可以将一组值转换为数组

Array.of(12,33,53) //[12,33,53]

加入这个方法的主要目的在于：弥补数组构造函数Array（）的不足，因为参数个数的不同会导致Array（）行为的差异

Array.of基本可以用来代替Array（）或者new Array（） ，并且不存在由于参数不同导致的重载，行为非常的统一

参考文献：
[1] 阮一峰 .《ES6标准入门（第2版）》[M].北京.电子工业出版社.2015