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 相关文章推荐
再谈javascript 动态添加样式规则 W3C校检
Dec 25 Javascript
jquery 插件学习(六)
Aug 06 Javascript
验证手机号码的JS方法分享
Sep 10 Javascript
加随机数引入脚本不让浏览器读取缓存
Sep 04 Javascript
使用jquery+CSS实现控制打印样式
Dec 31 Javascript
javascript基于DOM实现省市级联下拉框的方法
May 14 Javascript
JavaScript中获取HTML元素值的三种方法
Jun 20 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
Oct 05 Javascript
使用Webpack提高Vue.js应用的方式汇总(四种)
Jul 10 Javascript
vue实现的上传图片到数据库并显示到页面功能示例
Mar 17 Javascript
JavaScript 反射和属性赋值实例解析
Oct 28 Javascript
vue+element ui实现锚点定位
Jun 29 Vue.js
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
Youku 视频绝对地址获取的方法详解
2013/06/26 PHP
跨浏览器PHP下载文件名中的中文乱码问题解决方法
2015/03/05 PHP
PHP实现动态web服务器方法
2015/07/29 PHP
PHP实现根据时间戳获取周几的方法
2016/02/26 PHP
CentOS下搭建PHP环境与WordPress博客程序的全流程总结
2016/05/07 PHP
PHP中如何判断exec函数执行成功?
2016/08/04 PHP
PHP房贷计算器实例代码,等额本息,等额本金
2017/04/01 PHP
javascript 45种缓动效果 非常酷
2011/06/28 Javascript
理解JSON:3分钟课程
2011/10/28 Javascript
使用javascript做的一个随机点名程序
2014/02/13 Javascript
基于Jquery实现表单验证
2020/07/20 Javascript
Angularjs自定义指令实现三级联动 选择地理位置
2017/02/13 Javascript
JS获取浮动(float)元素的style.left值为空的快速解决办法
2017/02/19 Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
2017/05/20 jQuery
Nodejs模块载入运行原理
2018/02/23 NodeJs
Vue2.0系列之过滤器的使用
2018/03/01 Javascript
基于iScroll实现内容滚动效果
2018/03/21 Javascript
Vue动态修改网页标题的方法及遇到问题
2019/06/09 Javascript
对vue中的事件穿透与禁止穿透实例详解
2019/10/28 Javascript
零基础写python爬虫之HTTP异常处理
2014/11/05 Python
利用Python在一个文件的头部插入数据的实例
2018/05/02 Python
Python2实现的图片文本识别功能详解
2018/07/11 Python
Tensorflow 合并通道及加载子模型的方法
2018/07/26 Python
python二维码操作:对QRCode和MyQR入门详解
2019/06/24 Python
基于python二叉树的构造和打印例子
2019/08/09 Python
python3 webp转gif格式的实现示例
2019/12/10 Python
tensorflow-gpu安装的常见问题及解决方案
2020/01/20 Python
Django3中的自定义用户模型实例详解
2020/08/23 Python
HTML5 Web存储方式的localStorage和sessionStorage进行数据本地存储案例应用
2012/12/09 HTML / CSS
html5 http的轮询和Websocket原理
2018/10/19 HTML / CSS
Moda Operandi官网:美国奢侈品电商,海淘秀场T台同款
2020/05/26 全球购物
2014年党员创先争优承诺书
2014/05/29 职场文书
2015年财务科工作总结范文
2015/05/13 职场文书
gateway网关接口请求的校验方式
2021/07/15 Java/Android
Javascript设计模式之原型模式详细
2021/10/05 Javascript
 Redis 串行生成顺序编码的方法实现
2022/04/03 Redis