JavaScript数组的一些奇葩行为


Posted in Javascript onJanuary 25, 2016

在程序语言中数组的重要性不言而喻,JavaScript中数组也是最常使用的对象之一,数组是值的有序集合,由于弱类型的原因,JavaScript中数组十分灵活、强大,不像是Java等强类型高级语言数组只能存放同一类型或其子类型元素,JavaScript在同一个数组中可以存放多种类型的元素,而且是长度也是可以动态调整的,可以随着数据增加或减少自动对数组长度做更改。

今天,复习了一下JavaScript的数组,然后,把他的一些奇葩行为总结了一下,在这里和大家share一下,如果有不对的地方,欢迎指出!

奇葩1:Array()构造器函数可以不使用new关键字进行调用:

Array()构造器使用传递给他的参数作为数组的元素,从而创建数组,一般的,我们是如下调用的:

var a = new Array(1, 2, "bom!");
a.length; //3
console.log(a); //[1, 2, "bom!"]

但是,省略掉new也是可以的,如下:

var a = Array(1, 2, "bom!");
a.length; //3
console.log(a); //[1, 2, "bom!"]

虽然,我不知道他的内部实现机制是什么,但是,猜想他的构造器函数可能是如下定义的:

function Array(args) {
//如果,this不是Array的实例的话,
//说明不是通过new调用的,则在这里再重新调用
if( !this instanceof Array) {
return new Array(args);
}//后面是正常调用时的实现代码
//...
}

奇葩2:当只传一个参数给构造函数时,行为莫测

如果只传一个参数,并且这个参数是一个整数,将会得到一个数组,并且length等于这个参数

var a = new Array(12);
console.log(a.length); //12
console.log(a); //[]

如果只传一个浮点数,就会报错:

var a = new Array(1.1); //Uncaught RangeError: Invalid array length(…)

传递一个字符串就会正常工作,并且该字符串作为数组的第一个元素:

var a = new Array("1.1");
console.log(a.length); //
console.log(a); //["1.1"]

但是为了避免二义性,我建议最好是是直接使用字面量的形式创建数组:

var a = []; //空数组
var a = [1, 1, "bom"]; //三个元素
var a = [12]; //一个元素,并且元素是12

奇葩3:数组的length属性可以被修改(可写)

如下,我们直接把本来是2的length改成了100,而且还修改成功了!!!

var a = [1, 2, 3, 4];
console.log(a.length); //4
a.length = 100; 
console.log(a.length); //100

虽然length等于100,但是,元素a[4]-a[99]是不存在的,并且如果你请求他们的值的话,例如,从0到a.length做一个循环中做的话,那么会得到undefined。

接下来再看:

var a = [1, 2, 3, 4];
a.length = 100;
console.log(a[10]); //undefined
console.log(99 in a); //false

与下面的例子有点相似:

var a = [1, 2, 3, 4];
a[99] = undefined;
console.log(a.length); //100

不同之处在于,这里的a[99]存在了,因为我们创建了它,即使他拥有的是undefined的值。但是从a[4]到a[98]的所有元素则是不存在的,如下:

var a = [1, 2, 3, 4];
a[99] = undefined;
console.log(99 in a); //true;
console.log(98 in a); //false
console.log(a.length); //100

以上所述给大家分享了JavaScript数组的一些奇葩行为,文章写的不好还请见谅,谢谢!

Javascript 相关文章推荐
根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码
Feb 22 Javascript
Firefox outerHTML实现代码
Jun 04 Javascript
解析javascript 浏览器关闭事件
Jul 08 Javascript
jQuery遍历Table应用示例
Apr 09 Javascript
js判断元素是否隐藏的方法
Jun 09 Javascript
微信小程序 获取微信OpenId详解及实例代码
Oct 31 Javascript
AngularJS框架的ng-app指令与自动加载实现方法分析
Jan 04 Javascript
JS中的三个循环小结
Jun 20 Javascript
vue mixins组件复用的几种方式(小结)
Sep 06 Javascript
为什么说JavaScript预解释是一种毫无节操的机制详析
Nov 18 Javascript
JS监听事件的叠加和移除功能
Nov 19 Javascript
Jquery cookie插件实现原理代码解析
Aug 04 jQuery
JavaScript文本框脚本编写的注意事项
Jan 25 #Javascript
详解js私有作用域中创建特权方法
Jan 25 #Javascript
超赞的jQuery图片滑块动画特效代码汇总
Jan 25 #Javascript
理解js对象继承的N种模式
Jan 25 #Javascript
解决js函数闭包内存泄露问题的办法
Jan 25 #Javascript
JavaScript数据类型学习笔记
Jan 25 #Javascript
分步解析JavaScript实现tab选项卡自动切换功能
Jan 25 #Javascript
You might like
PHP中的排序函数sort、asort、rsort、krsort、ksort区别分析
2014/08/18 PHP
php中chdir()函数用法实例
2014/11/13 PHP
thinkphp3.2.2实现生成多张缩略图的方法
2014/12/19 PHP
PHP生成随机密码方法汇总
2015/08/27 PHP
php页面跳转session cookie丢失导致不能登录等问题的解决方法
2016/12/12 PHP
浅谈PHP匿名函数和闭包
2019/03/08 PHP
JCalendar 日历控件 v1.0 beta[兼容IE&Firefox] 有文档和例子
2007/05/30 Javascript
jquery中常用的SET和GET
2009/01/13 Javascript
JavaScript中获取高度和宽度函数总结
2014/10/08 Javascript
javascript 对象数组根据对象object key的值排序
2015/03/09 Javascript
php利用curl获取远程图片实现方法
2015/10/26 Javascript
Bootstrap开发实战之响应式轮播图
2016/06/02 Javascript
JS触发服务器控件的单击事件(详解)
2016/08/06 Javascript
vue实现动态数据绑定
2017/04/28 Javascript
详解Angular-ui-BootStrap组件的解释以及使用
2018/07/13 Javascript
Angular Excel 导入与导出的实现代码
2019/04/17 Javascript
微信小程序实现搜索指定景点周边美食、酒店
2019/05/18 Javascript
jQuery实现弹幕特效
2019/11/29 jQuery
通过实例了解JS执行上下文运行原理
2020/06/17 Javascript
JavaScript中layim之整合右键菜单的示例代码
2021/02/06 Javascript
[49:35]LGD vs OG 2018国际邀请赛淘汰赛BO3 第二场 8.25
2018/08/29 DOTA
Python3实战之爬虫抓取网易云音乐的热门评论
2017/10/09 Python
numpy matrix和array的乘和加实例
2018/06/28 Python
python针对mysql数据库的连接、查询、更新、删除操作示例
2019/09/11 Python
python元组和字典的内建函数实例详解
2019/10/22 Python
python文件操作的简单方法总结
2019/11/07 Python
Django连接数据库并实现读写分离过程解析
2019/11/13 Python
CSS3使用transition实现的鼠标悬停淡入淡出
2015/01/09 HTML / CSS
预订奥兰多和佛罗里达州公园门票:FloridaTix
2018/01/03 全球购物
英国手机零售商:Carphone Warehouse
2018/06/06 全球购物
大学毕业生工作的自我评价
2013/10/01 职场文书
学习党代会心得体会
2014/09/05 职场文书
民政局离婚协议书范本
2014/10/20 职场文书
2015年统计员个人工作总结
2015/07/23 职场文书
spring 项目实现限流方法示例
2022/07/15 Java/Android
Spring boot实现上传文件到本地服务器
2022/08/14 Java/Android