我是靠谱客的博主 沉静学姐,最近开发中收集的这篇文章主要介绍javascript 类数组,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

http://segmentfault.com/blog/f2e/1190000000415572

google了下,中文介绍的很少。最终还是在在线的《javascript权威指南》free阅读上找到了。

看来我没细看《javascript权威指南》啊!白买了。

那么,什么是javascript 类数组呢?

定义:

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

ps:这是我参考的定义,实际上,只要有length属性,且它的属性值为number类型就行了。请围观评论。

类数组示例:

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;
}
};

参考:

1.https://www.inkling.com/read/javascript-definitive-guide-david-flanagan-6th/chapter-7/array-like-objects
2.JavaScript 的怪癖 8:“类数组对象”



最后

以上就是沉静学姐为你收集整理的javascript 类数组的全部内容,希望文章能够帮你解决javascript 类数组所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(45)

评论列表共有 0 条评论

立即
投稿
返回
顶部