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 相关文章推荐
use jscript Create a SQL Server database
Jun 16 Javascript
JavaScript中Math对象使用说明
Jan 16 Javascript
javascript 写类方式之四
Jul 05 Javascript
JavaScript取得鼠标绝对位置程序代码介绍
Sep 16 Javascript
jQuery对Select的操作大集合(收藏)
Dec 28 Javascript
js+css实现的简单易用兼容好的分页
Dec 30 Javascript
激动人心的 Angular HttpClient的源码解析
Jul 10 Javascript
js canvas实现适用于移动端的百分比仪表盘dashboard
Jul 18 Javascript
EL表达式截取字符串的函数说明
Sep 22 Javascript
JS和JQuery实现雪花飘落效果
Nov 30 jQuery
微信小程序使用input组件实现密码框功能【附源码下载】
Dec 11 Javascript
详解vue中的父子传值双向绑定及数据更新问题
Jun 13 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使用指定字符列表生成随机字符串的方法
2015/04/18 PHP
在laravel中实现将查询的对象转换为多维数组的函数
2019/10/21 PHP
JS高级笔记
2011/07/13 Javascript
jQuery EasyUI API 中文文档 - ComboBox组合框
2011/10/07 Javascript
window.showModalDialog参数传递中含有特殊字符的处理方法
2013/06/06 Javascript
去掉gridPanel表头全选框的小例子
2013/07/18 Javascript
淘宝网提供的国内NPM镜像简介和使用方法
2014/04/17 Javascript
JS常用字符串处理方法应用总结
2014/05/22 Javascript
Node.js服务器环境下使用Mock.js拦截AJAX请求的教程
2016/05/23 Javascript
Jquery鼠标放上去显示全名的实现方法
2017/02/06 Javascript
Vue中添加过渡效果的方法
2017/03/16 Javascript
浅谈vue.js中v-for循环渲染
2017/07/26 Javascript
再谈Angular4 脏值检测(性能优化)
2018/04/23 Javascript
vue 下列表侧滑操作实例代码详解
2018/07/24 Javascript
react实现同页面三级跳转路由布局
2019/09/26 Javascript
利用node.js开发cli的完整步骤
2020/12/29 Javascript
Python装饰器基础详解
2016/03/09 Python
python 安装virtualenv和virtualenvwrapper的方法
2017/01/13 Python
Python系统监控模块psutil功能与经典用法分析
2018/05/24 Python
对python GUI实现完美进度条的示例详解
2018/12/13 Python
基于python-opencv3的图像显示和保存操作
2019/06/27 Python
用Python爬取QQ音乐评论并制成词云图的实例
2019/08/24 Python
Lenox官网:精美的瓷器&独特的礼品
2017/02/12 全球购物
澳大利亚Rockwear官网:女子瑜伽、健身和运动服
2021/01/26 全球购物
应届生求职推荐信
2013/10/28 职场文书
中学生团员自我评价分享
2013/12/07 职场文书
写给女生的道歉信
2014/01/08 职场文书
会计毕业自我鉴定
2014/02/05 职场文书
中餐厅经理岗位职责
2014/04/11 职场文书
公司承诺书范文
2014/05/19 职场文书
设备售后服务承诺书
2014/05/30 职场文书
四风问题查摆材料
2014/08/25 职场文书
解决Golang中ResponseWriter的一个坑
2021/04/27 Golang
Python基础之常用库常用方法整理
2021/04/30 Python
vue+elementUI实现表格列的显示与隐藏
2022/04/13 Vue.js
python 使用pandas读取csv文件的方法
2022/12/24 Python