解决js array的key不为数字时获取长度的问题

最近写js时碰到了当数组key不为数字时,获取数组的长度为0 的情况。

1、问题场景

var arr = new Array();
arr[‘s1‘] = 1001;
console.log(arr.length);

通过firebug查看:

2、原因分析

js Array只支持数字索引,若指定的key为非数字索引,那么length为0.

另外,若key为数字索引,length的长度是根据key值得出的,比如一个数组a中key最大值为1000,value为1000,那么a的长度就是1001.只有a[1000] = 1000.从a[0]到a[999]的值为undefined

可以来验证一下:

var arr = new Array();
    arr[1000] = 1001;
    console.log(arr.length);

3、解决长度问题

出现问题的原因已经知道了,有的时候我们需要设置的key不是数字索引,而是非数字索引,那么如何获取长度呢。我们可以把Array看成是特殊的Object类型。有两种方式可以得到Object类型的长度:

第一种方法:通过 Object.keys(obj).length 获取。

可以验证下:

var obj = new Object();
    obj[1001] = 1001;
    obj[1002] = 1002;
    console.log(obj.length);
    console.log(Object.keys(obj).length);

该方法获取长度是会获取到原型的属性的,如果一个对象继承了另一个对象,或者在原型中设置了属性,要想获取对象的本身的属性时,这个方法是不靠谱的。

因此,第二个方法就是过滤到原型的属性:

调用:var length = getPropertyCount(obj);

由于任何一个Object对象都有方法 hasOwnProperty,当属性为原型定义的属性,hasOwnProperty返回true。

function getPropertyCount(o){  
       var n, count = 0;  
       for(n in o){  
          if(o.hasOwnProperty(n)){  
             count++;  
          }  
       }  
       return count;  
    }

问题到这里应该可以解决了,现在想要获取一个数组的实际指定的长度,一般来说,我们不会为Array的原型添加额外的属性,所以,我们可以通过采用上面的第一种方式解决。

可以验证下:

var arr = new Array();
    arr[‘s2‘] = "1001";
    arr[‘s1‘] = 1001;
    console.log(arr.length);    
    console.log(Object.keys(arr).length);

题外话:

判断一个属性是否是共享属性,可以通过hasOwnProperty 及in 联合判断。

hasOwnProperty:当对象存在属性且属性不是共享的,返回true

in:当对象中存在属性,返回true.

因此,如判断person中是否存在私有属性属性a,person.hasOwnPropety(a) && a in person 需返回true

判断person中是否存在共享属性属性a, !person.hasOwnProperty(a) && a in person 需返回true

时间: 2024-11-08 23:23:41

解决js array的key不为数字时获取长度的问题的相关文章

对象key值为数字时的处理

先说解决办法: 通过a[key]的方式获取. 具体场景是这样的: 有一个对象的key是数字组成的,这时候使用a.b的形式就不能获取到相应的value值, 如下图: a.'111'会报错. 特别说明: a['111']和a[111]两种写法都是一样的,没有什么区别,此用法与数组用下标访问是相同的. 另: 当对象的key为一个变量时,并且使用在循环中,那我们可以通过data['key']这种方式来动态生成对象,eg: 总结: 1.对象的key一般应使用合法的变量名(字母或下划线开头的包括字母.下划线

JSON的key值为数字时如何使用

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.易于人阅读和编写.同时也易于机器解析和生成.它基于JavaScript(Standard ECMA-262 3rd Edition - December 1999)的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等).这些特性使JSON成为理想的数据交换语言. 比较标准的写法:

js解析php返回的json数据无法获取length的问题分析

1.问题出现的过程,js解析php json_encode 的数据,无法获取长度信息,提示undefined debug: 首先打印查看了php encode后的数据,返现最外层是一个中括号,误以为编码成了一个数组,于是将其强制类型转换为Object ,但是长度依然undefined 在同样是解析json的话题ppt页面,控制台打印json,发现有一个length的属性,起初以为是在php端加到数组中的,查看后发现并非如此,于是乎stackoverflow上查询得知,要想有此属性,必须是一个js

js Array Map and Set

Array slice slice()就是对应String的substring()版本,它截取Array的部分元素,然后返回一个新的Array: var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G']; arr.slice(0, 3); // 从索引0开始,到索引3结束,但不包括索引3: ['A', 'B', 'C'] arr.slice(3); // 从索引3开始到结束: ['D', 'E', 'F', 'G'] Note:slice()的起止参数包括开始索

解决js获取数据跨域问题,jsonP

网上说了一些jsonp的示例,感觉都没用,最后研究了一下,调用腾讯的一个api.最后要加output=jsonp&callback=?这个,比较适用. var url = "http://apis.map.qq.com/ws/place/v1/search?boundary=nearby(39.908491,116.374328,1000)&keyword=%E6%88%90%E9%83%BD&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77

js Array的一个函数indexOf( )

js Array的一个函数:indexOf(i) var  a = [1,2,3,4]; a.indexOf(2) 返回-1则表示2不在a中,反之则2为a的一个元素 此方法可以用来删除掉Array中的重复元素

.NET解决JS引用 全局污染等问题

在需要引用的ASPX页面上加上这句话 <!--#include file="/js/inc.html"--> 创建一个HTML页面,结构如下 <script src="/js/ArrayList.js"></script> <script src="/js/main.js"></script> 通过include引用HTML页面,HTML页面来引用JS文件来控制JS文件的引用. 定义JS

Numeral.js 是一个用于格式化和数字四则运算的js 库

1.Numeral.js 是一个用于格式化和数字四则运算的js 库. 2.支持多种语言,包含中文在内的17种语言. 在浏览器中引用js文件: <script src="numeral.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/1.4.5/numeral.min.js"></script> 在nodejs开发引用开

CSS解决无空格太长的字母,数字不会自动换行的问题

其实很简单,代码如下所示,注意 Style: <div class="detail_title" style="word-break: break-all;"><%=StringUtil.toHTML(title) %></div> 默认情况下,一个 DIV或者其他元素的文本,如果都是无文字分隔符,无空格,则不会自动换行,比如: <div class="detail_title" style="