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 相关文章推荐
js实现DIV的一些简单控制
Jun 04 Javascript
javascript 得到变量类型的函数
May 19 Javascript
解释&&和||在javascript中的另类用法
Jul 28 Javascript
JS中自定义定时器让它在某一时刻执行
Sep 02 Javascript
alert出数组中的随即值代码
Sep 25 Javascript
jQuery中append()方法用法实例
Jan 08 Javascript
jQuery选择器源码解读(三):tokenize方法
Mar 31 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
Apr 27 Javascript
详解layui中的树形关于取值传值问题
Jan 16 Javascript
JS面试题大坑之隐式类型转换实例代码
Oct 14 Javascript
javascript实现函数柯里化与反柯里化过程解析
Oct 08 Javascript
weui上传多图片,压缩,base64编码的示例代码
Jun 22 Javascript
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企业级应用之常见缓存技术篇
2011/01/27 PHP
PHP获取一年中每个星期的开始和结束日期的方法
2015/02/12 PHP
PHP实现文件下载【实例分享】
2017/04/28 PHP
PHP通过文件保存和更新信息的方法分析
2019/09/12 PHP
php实现通过stomp协议连接ActiveMQ操作示例
2020/02/23 PHP
JS去除字符串的空格增强版(可以去除中间的空格)
2009/08/26 Javascript
移动端JQ插件hammer使用详解
2015/07/03 Javascript
jQuery取得iframe中元素的常用方法详解
2016/01/14 Javascript
jQuery动态添加
2016/04/07 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
2016/04/29 Javascript
JavaScript的变量声明提升问题浅析(Hoisting)
2016/11/30 Javascript
jQuery Jsonp跨域模拟搜索引擎
2017/06/17 jQuery
js实现图片旋转 js滚动鼠标中间对图片放大缩小
2017/07/05 Javascript
jQuery实现QQ空间汉字转拼音功能示例
2017/07/10 jQuery
VueJS事件处理器v-on的使用方法
2017/09/27 Javascript
JS实现图片上传多次上传同一张不生效的处理方法
2018/08/06 Javascript
微信小程序事件 bindtap bindinput代码实例
2019/08/26 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
2020/08/28 Javascript
vant中的toast层级改变操作
2020/11/04 Javascript
[48:05]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 VGJ.T vs VP
2018/03/31 DOTA
python对象及面向对象技术详解
2016/07/19 Python
通过Python 获取Android设备信息的轻量级框架
2017/12/18 Python
浅谈Python用QQ邮箱发送邮件时授权码的问题
2018/01/29 Python
python实现校园网自动登录的示例讲解
2018/04/22 Python
python里运用私有属性和方法总结
2019/07/08 Python
python修改字典键(key)的方法
2019/08/05 Python
python opencv实现gif图片分解的示例代码
2019/12/13 Python
No module named ‘win32gui‘ 的解决方法(踩坑之旅)
2021/02/18 Python
详解如何通过H5(浏览器/WebView/其他)唤起本地app
2017/12/11 HTML / CSS
高三学生评语大全
2014/04/25 职场文书
学校消防安全责任书
2014/07/23 职场文书
派出所班子党的群众路线对照检查材料思想汇报
2014/10/01 职场文书
2014年统计工作总结
2014/11/21 职场文书
三潭印月的导游词
2015/02/12 职场文书
pytorch中的model.eval()和BN层的使用
2021/05/22 Python
浅谈Redis位图(Bitmap)及Redis二进制中的问题
2021/07/15 Redis