类数组与数组的区别及相互转化

函数的arguments对象

arguments是一个类数组对象,包含着传入函数中的所有实参集合,虽然arguments主要作用是保存函数实参,但这个arguments有一个callee属性,它是一个指针,指向拥有这个arguments对象的函数。

函数也是对象,因此函数也有属性和方法,每个函数都包含length属性和prototype这个原型属性,其中,length表示函数希望接收的形参个数.
类数组与数组的区别及相互转化

类数组与数组的区别

相同点:都可用下标访问每个元素,都有length属性。

不同点:数组对象的类型是Array,类数组对象的类型是object,也就是说类数组原型是Object;类数组不具有数组所具有的方法,数组遍历可以用 for in和for循环,类数组只能用for循环遍历。

常见的类数组有: 函数的参数 arguments, DOM 对象列表(比如通过 document.querySelectorAll 得到的列表), jQuery 对象 (比如 $(“div”)).
类数组与数组的区别及相互转化
结果为3, 2, true, undefined

分析:length指要传入函数的形参个数,arguments是函数实参的集合,callee属性是一个指针,指向拥有这个arguments对象的函数test,只有两个实参所以没有arguments[2]这一项。

类数组与数组的转化

数组转变成类数组:

var arr = [1, 2, 3, 4];
var obj = { };
[ ].push.apply(obj, arr);
console.log(obj);
输出为原型为Object 的一个对象
类数组与数组的区别及相互转化

类数组转换为数组:

方法一:Array.prototype.slice.call(arrayLike, start);
类数组与数组的区别及相互转化
方法二: Array.from(arrayLike);

Array.from()是ES6中新增的方法,可以将两类对象转为真正的数组:类数组对象和可遍历(iterable)对象(包括ES6新增的数据结构Set和Map)。

例子1:
类数组与数组的区别及相互转化
例子2:
类数组与数组的区别及相互转化
方法三:扩展运算符(…)
类数组与数组的区别及相互转化
类数组与数组的区别及相互转化