JS中的伪数组[Object object]转换为真数组

最近工作的时候发现一个奇怪的数据，后端给过来的数据，再传给后端，请求负载里面这段数据变成了[Object object]，后端解析不了，多方查找，知道了“伪数组”这个概念，在此记录一下。

一、什么是“伪数组”

伪数组也叫做类数组，就是像数组一样有 length 属性，也有 0、1、2、3 等属性的对象，看起来就像数组一样，但不是数组，如下所示：

从上图标注的 [[prototype]]可以看到arguments伪数组的原型指向的是Object对象，我们再来看看真数组：

可以看到，真数组的proto指向的是Array数组。
伪数组有如下特点：

1. 拥有length属性，可以获取长度;
2. 拥有角标索引，可以通过length属性遍历获取所有值。
3. 但是不可以使用数组的内置方法，如forEach(), push(), pop(), splice()等。

二、判断是否是“伪数组”

1. 用Array.isArray

Array.isArray(weiArray) === false;//伪数组
Array.isArray(arr) === true;//真数组

2. 用instanof

 console.log(weiArray instanceof Array)//false
 console.log(arr instanceof Array)//true

三、“伪数组”转真数组

1. 最简单的方法：先声明一个空数组，然后遍历伪数组，将伪数组中的值通过索引逐个添加到新数组当中。

let newArr = [];
for(let i = 0;i<weiArr.length;i++){
    newArr[i] = weiArr[i];
}

2. 利用Array的原型对象的slice方法，配合call()方法修改slice中this指向，slice原本是数组的截取子数组的方法，这里给数组的原型对象方法slice的指向强制改成arguments

let newArr = Array.prototype.slice.call(weiArr)

3. 利用扩展运算符(…)将伪数组转化为真数组 - ES6语法 let newArr=[];

let newArr = [...weiArr]

4. 利用ES6的Array.from方法

let arr = Array.from(weiArr)

四、总结

伪数组的原型是Object ,是真数组的原型是Array ;

伪数组其实是键值对的形式，真数组是基于索引下标实现的；

伪数组可以通过以上方式转化为真数组，进而使用数组的forEach等其他方法

当然了，如果只是普通遍历也可以用for循环来实现，不需要转真数组这么麻烦，在实际开发中大家也要酌情使用哦

作者刚刚踏入职场，以上为网络上各路大神笔记的汇总，仅作记录之用，有错漏之处，还请指正。