javascript 类数组对象

时间：2021-11-10 16:44:33

原文：https://segmentfault.com/a/1190000000415572

定义：

  • 拥有length属性，其他属性（索引）为非负整数（对象中的所有会被当做字符串来处理，这里你可以当做是个非负整数串来理解）
  • 不具有数组所具有的方法

类数组示例：

var a = {'1':'gg','2':'love','4':'meimei',length:5};

Array.prototype.join.call(a,'+');//'+gg+love++meimei'

非类数组示例：

var c = {'1':2};

没有length属性，所以就不是类数组。

javascript中常见的类数组有arguments对象和DOM方法的返回结果。
比如 document.getElementsByTagName()。

类数组判断

《javascript权威指南》上给出了代码用来判断一个对象是否属于“类数组”。如下：

// Determine if o is an array-like object.

// Strings and functions have numeric length properties, but are

// excluded by the typeof test. In client-side JavaScript, DOM text

// nodes have a numeric length property, and may need to be excluded

// with an additional o.nodeType != 3 test.

function isArrayLike(o) {

    if (o &&                                // o is not null, undefined, etc.

        typeof o === 'object' &&            // o is an object

        isFinite(o.length) &&               // o.length is a finite number

        o.length >= 0 &&                    // o.length is non-negative

        o.length===Math.floor(o.length) &&  // o.length is an integer

        o.length < 4294967296)              // o.length < 2^32

        return true;                        // Then o is array-like

    else

        return false;                       // Otherwise it is not

}

类数组表现

之所以成为“类数组”，就是因为和“数组”类似。不能直接使用数组方法，但你可以像使用数组那样，使用类数组。

var a = {'0':'a', '1':'b', '2':'c', length:3};  // An array-like object

Array.prototype.join.call(a, '+'');  // => 'a+b+c'

Array.prototype.slice.call(a, 0);   // => ['a','b','c']: true array copy

Array.prototype.map.call(a, function(x) {

    return x.toUpperCase();

});                                 // => ['A','B','C']:

类数组对象转化为数组

有时候处理类数组对象的最好方法是将其转化为数组。

Array.prototype.slice.call(arguments)

然后就可以直接使用数组方法啦。

var a = {'0':1,'1':2,'2':3,length:3};

var arr = Array.prototype.slice.call(a);//arr=[1,2,3]

对于IE9以前的版本(DOM实现基于COM)，我们可以使用makeArray来实现。

// 伪数组转化成数组

var makeArray = function(obj) {

    if (!obj || obj.length === 0) {

        return [];

    }

    // 非伪类对象，直接返回最好

    if (!obj.length) {

        return obj;

    }

    // 针对IE8以前 DOM的COM实现

    try {

        return [].slice.call(obj);

    } catch (e) {

        var i = 0,

            j = obj.length,

            res = [];

        for (; i < j; i++) {

            res.push(obj[i]);

        }

        return res;

    }

};

相关文章