类数组对象ArrayLike

什么是类数组对象

 

• 在 js 中，有些对象被叫做“类数组对象 ”（array-like object） ，因为这些对象看起来很像数组，可以使用 length 属性，但是无法使用数组的方法。
• 典型的类数组对象是函数的 arguments 对象，以及大多数 DOM 元素集，还有字符串

    var array = ['name','age','sex'];
    var arrayLike = {
        0:'name',
        1:'age',
        2:'sex',
        length:3
    }

 

读写

console.log(array[0]);// name
console.log(arrayLike[0]);//name

array[0] = 'new name';
arrayLike[0] = 'new name';

长度

console.log(array.length);//3
console.log(arrayLike.length);//3

 

遍历

 

for(var i = 0, len = array.length; i < len; i++) {
    //TODO
}
for(var i = 0, len = arrayLike.length; i < len; i++) {
    //TODO
}

类数组不能使用数组的方法
 

    arrayLike.push('new item');
    //arrayLike.push is not a function

类数组转化

 

• es5

        //slice
        var newArrayy = [].slice.call(arrayLike);//['name','age','sex'];
        //splice,会改变原arrayLike的内容
        var newArray2 = [].splice.call(arrayLike,0)//['name','age','sex'];

 

• es6

        //Array.from
        Array.from(arrayLike);//['name','age','sex'];
        //apply
        Array.prototype.concat.apply([],arrayLike);//['name','age','sex'];