javascript中length属性的探索
发布时间:2020-07-27 23:52:25
例子1:
var obj={0:'a',1:'b'}
alert(obj.length); //undefined
var arr=['a','b']
alert(arr.length); // 2
从上面的例子看,类数组对象中的length属性并不和它储存的数据数量直接挂钩,无论是索引属性(0,1)还是length属性都作为对象的普通属性存在,它们之间并没有任何关系,js引擎并不会根据储存数据的数量来自动计算类数组对象的长度。
但是类数组对象的length所确实和存储的数据量没有任何关系么?例子2说明并非如此:
例子2:
function myarr(){}
var m=new myarr();
Array.prototype.push.apply(m,['cson','lai','xiaoc']);
alert(m.length);//IE8以下:undefined 其他浏览器:3
alert(m[2]);//IE8以下:undefined 其他浏览器:‘xiaoc'
从例子2可以看到,除了IE8以下版本,在通过强制使用数组方法为类数组对象添加元素时,对象的length属性也会被计算。而IE8以下版本貌似不支持强制使用数组方法为类数组对象添加元素。
例子3:
该例子在例子2的myarr构造函数中添加一个初始化操作,在类数组对象初始化时添加一个元素,怪异的事情发生了:
function myarr(){this[0]='cc';}
var m=new myarr();
Array.prototype.push.apply(m,['cson','lai','xiaoc']);
alert(m.length);//ie8以下:undefined 其他:3
alert(m[2]);//ie8以下:undefined 其他:xiaoc
ie8以下版本浏览器继续貌似不支持强制使用数组方法,这个再下一个例子中会作讨论。而对于其他浏览器,length属性输出为3,而索引为2的元素是'xiaoc‘,显然js引擎完全忽略了类数组对象原来所存在的索引为0的元素‘cc'!马上我们再看下一个例子,这个例子在例子3的基础上多加一个对length属性的初始化:
function myarr(){this[0]='cc'; this.length=1;}//多加一个length的初始化
var m=new myarr();
Array.prototype.push.apply(m,['cson','lai','xiaoc']);
alert(m.length);//输出4
alert(m[2]);//输出'lai‘
奇怪的事再次发生,这次所有浏览器(包括ie6 7)都正确输出4,索引为2的元素正确输出为'lai‘,可见IE 6 7添加了length属性的初始化之后,可以正常使用数组方法了。
现在再试试把length属性初始化为不合法类型:
例子4:
function myarr(){this[0]='cc'; this.length="bo";}//length设置为不能转换为number的不合法类型
var m=new myarr();
Array.prototype.push.apply(m,['cson','lai','xiaoc']);
alert(m.length);//输出 3
alert(m[2]);// 输出'xiaoc‘
function myarr(){this[0]='cc'; this.length="1";}//length设置为能转换为数字的不合法类型
Array.prototype.push.apply(m,['cson','lai','xiaoc']);
alert(m.length);//输出4
alert(m[2]);//输出'lai‘
从上面的所有例子来看,我们可以作出一个推断,在使用数组方法时(这里以push为例),大概是这样的流程:
IE6 7:
可见IE6 7并非不支强制持使用数组方法添加元素,但是会先判断length属性是否存在,如果不存在,则返回,不做任何操作。如果length属性为不合法值,则尝试转换为number类型,如果转换失败则length设置为0,这就可以解析例子2,3里输出的undefined和例子4的正确输出。
其他浏览器:
其他浏览器会根据length属性作不同操作,如果length属性不存在,则设置length为0,如果length属性为不合法值,则尝试转换为number类型,如果转换失败则也length设置为0。
正因为length属性对于数组方法有如此决定性的作用,因此js引擎禁止了对length属性写入不合法值:
var arr=['1','2','3'];
arr.length='undefined';//报错invalid array length
从上面的例子中,我们可以得出一个结论:当我们使用类数组对象时,为了避各种length计算不正确引起的怪异问题,我们应该在初始化类数组对象时初始化length属性的值,如果在初始化时添加了元素但却没有设置length属性的值,在使用数组方法时,IE6 7会忽略所有操作,其他浏览器则会忽略初始化时添加的元素。
另外再介绍length属性带来的另一个问题:
请看例子5:
function myarr(){}
myarr.prototype=new Array();
var m=new myarr();
m.push('cson','lai','xiaoc');
alert(m.length);//IE6 7:0 其他:3
alert(m[2]);//所有浏览器:'xiaoc‘
当使用原型继承数组时,IE 6 7下length会始终为0,无论你有多少个元素,其他浏览器则正常。
即使强制设置length属性,IE6 7 下死活为0:
function myarr(){}
myarr.prototype=new Array();
var m=new myarr();
m.length=10;
alert(m.length);//IE6 7:0 其他:10
因此得出结论:IE6 7下对象原型继承数组时length属性会一直为0,因此如果类数组对象需要使用数组的方法,不要去继承数组,而应该使用Array.prototype.xxx.apply(obj,[]);的方法,并且记得正确初始化length属性的值。


猜你喜欢
- text函数的功能是向数据点添加文本说明。语法text(x,y,txt)text(x,y,z,txt)text(___,Name,Value
- 完整的Oracle数据库通常由两部分组成:Oracle数据库和数据库实例。 1) 数据库是一系列物理文件的集合(数据文件,控制文件,联机日志
- select CONVERT(varchar, getdate(), 120 ) 200
- 前言:tkinter提供了3种布局管理方式:1、pack2、grid3、place每种布局管理器都非常有用,根据不同的需求,选择对应的布局方
- 使用 Appium安装一下 Python 用到的模块pip install Appium-Python-Client获取好友列表在 Pych
- 最近想抢冰墩墩的手办和钥匙圈,但是同志们抢的速度太快了,无奈,还是自己写脚本吧。添加火狐浏览器插件Omnibug是一个插件,可以简化web度
- 一、概述现有一个wenda1.xlsx文件,内容如下:需要将faq记录合并为一行,效果如下:注意:faq记录,每一行用||来拼接。二、多行转
- 作用装饰器可以用于用于装饰一个函数或方法,使得在不修改原函数、方法代码的前提下,为方法添加前置或后置操作;例如突然想要计算一下各个函数的执行
- Python使用称为Python Path的搜索路径来查找使用import语句导入代码的模块。大多数代码只会汇入已经默认路径上的模块,通过安
- Python递归函数实例1、打开Python开发工具IDLE,新建‘递归.py'文件,并写代码如下:def digui(n):if
- 这篇文章主要介绍了Python unittest工作原理和使用过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学
- 在用Pycharm运行项目时,不知道干了什么,导致运行后无法像平时那样显示输出结果:最后试了很多种方法,终于解决了:将打勾的地方去掉,不要运
- 本文实例讲述了python删除特定文件的方法。分享给大家供大家参考。具体如下:#!/usr/bin/python# -*- coding:
- 完成这个小球的完全弹性碰撞游戏灵感来自于:下面是我花了一周下班时间所编写的一个小球完全弹性碰撞游戏:游戏初始化状态:最下面的游标和修改小球的
- location.href这个东西常常用于跳转,location既是window对象的属性,又是document对象的属性。JavaScri
- 本文实例讲述了Symfony2实现在controller中获取url的方法。分享给大家供大家参考,具体如下:// 假设当前URL地址是htt
- 本文实例为大家分享了python(列表生成式/器)的具体代码,供大家参考,具体内容如下一、列表生成式#列表生成式是快速生成一个列表的一些公式
- 写任何编程代码,不同的开发者都会有不同的见解。但参考一下总是好的,下面是来自 Javascript Toolbox 发布的 14条最佳JS代
- SnowNLP是国人开发的python类库,可以方便的处理中文文本内容,是受到了TextBlob的启发而写的,由于现在大部分的自然语言处理库
- 介绍图像分类器通常在训练更多的图像时表现得更好。在图像分类模型中,一个常见的问题是,模型不能正确地对图像进行分类,只是因为它没有针对同一图像