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

1、问题场景

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

通过chrome查看:

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的原型添加额外的属性,所以,我们可以通过采用上面的第一种方式解决。

可以验证下:

题外话:

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

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

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

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

判断person中是否存在共享属性属性a, !person.hasOwnProperty(a) && a in person 需返回true
 
 
 
 
 
 
 
原文:http://www.cnblogs.com/wmmang-blog/p/4067143.html

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

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

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.易于人阅读和编写.同时也易于机器解析和生成.它基于JavaScript(Standard ECMA-262 ...

  2. js控制 input框中输入数字时,累计求和

    $('.cc input').bind('input propertychange', function(){ var total = 0; $("input").each(fun ...

  3. js input框限制输入为数字并限制长度

    <input type="number" name="price" id="priceVal" placeholder="请 ...

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

    1.问题出现的过程,js解析php json_encode 的数据,无法获取长度信息,提示undefined   debug:       首先打印查看了php encode后的数据,返现最外层是一个 ...

  5. 一行代码解决JS数字大于2^53精度错误的问题

    服务端使用长整型(Int64)的数字,在浏览器端使用JS的number类型接收时,当这个实际值超过 (2^53-1)时,JS变量的值和实际值就会出现不相等的问题.常见场景比如使用雪花算法生成Id. 在 ...

  6. js:Array对象常用方法介绍

    前言 在js中,数组作为一个特殊的对象.是我们常用的数据格式.今天就来梳理一下常用的数组方法. 1.基础 几种基础的就简单介绍一下:创建数组 var arr1 = new Array(); //括号可 ...

  7. 【转】js 中导出excel 较长数字串会变为科学计数法

    [转]js 中导出excel 较长数字串会变成科学计数法 在做项目中,碰到如题的问题.比如要将居民的信息导出到excel中,居民的身份证号码因为长度过长(大于10位),excel会自动的将过长的数字串 ...

  8. Gson如何解析key值是数字的json数据

    1.使用注解@SerializedName来解决这个问题 2.比如有如下json数据:(key值是数字"1112") { "1112": "抖音&qu ...

  9. js Array操作

    JS中数组的操作 1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长 ...

随机推荐

  1. logcat命令详解【一】

    Android日志系统提供了记录和查看系统调试信息的功能.日志都是从各种软件和一些系统的缓冲区中记录下来的,缓冲区可以通过logcat命令来查看和使用. 在使用logcat之前,请确保手机的USB调试 ...

  2. oracle问题:新建了一个PDM文件,建表后生成的sql语句中含有clustered

    问题描述 为了在oracle中新增表,在PDM中建表,使用其生成的sql语句,但是建表不能成功,提示 ORA-00906: 缺失左括号 原因是多了clustered 关键字 情景重现 1. 新建一个p ...

  3. android在更新ADT以后报java.lang.NoClassDefFound的解决办法

    Android不是很熟.从网上找到了想要的代码后兴高采烈的导入workspace中,直接开Run. but在真机的时候Console.LogCat下都没显示什么有用的东西,就是写NDK编译完Nativ ...

  4. java程序员修炼之前笔记(前半部分)

    第一部分 用java7做开发 第一章 初始java7 java7中的新特性 switch支持String 支持100_000_000数值表示法 新的异常处理 | 连接多个异常 final Except ...

  5. (转)深入理解最强桌面地图控件GMAP.NET --- 百度地图

    原文地址:http://www.cnblogs.com/enjoyeclipse/archive/2013/01/14/2859026.html 前两篇介绍了GMAP.NET的一些基本功能和如何在自己 ...

  6. 编写高质量代码改善C#程序的157个建议——建议102:区分接口和抽象类的应用场合

    建议102:区分接口和抽象类的应用场合 接口和抽象类有一些显而易见的区别: 接口支持多继承,抽象类则不能. 接口可以包含方法.属性.索引器.事件的签名,但不能有实现,抽象类则可以. 接口在增加新方法后 ...

  7. Centos 安装编译codeblocks&&codelite

    codeblocks http://www.cnblogs.com/magialmoon/archive/2013/05/05/3061108.html http://wiki.codeblocks. ...

  8. 设计模式3---工厂模式(Factory Pattern简单工厂、工厂方法、抽象工厂)

    工厂模式:主要用来实例化有共同接口的类,工厂模式可以动态决定应该实例化那一个类.工厂模式的形态工厂模式主要用一下几种形态:1:简单工厂(Simple Factory).2:工厂方法(Factory M ...

  9. CodeSmith Generator 6.5 自动生成后的源码分析

    1,NetTiers代码结构流程分析: 2,CodeSmithNetTiers使用实践总结 参看流程结构图和实体定义文件关系图,可以看出自动代码生成后,若是手工来调,还是很麻烦的.鉴于此,建议:1,若 ...

  10. PreTranslateMessage()函数捕获键盘按键消息

    01. PreTranslateMessage函数,常用于屏蔽MFC对话框中默认的Enter和ESC消息 函数原型:BOOL PreTranslateMessage(MSG* pMsg) 用法举例: ...