JavaScript中的数组特性介绍


Posted in Javascript onDecember 30, 2014

与Java语言不同,JavaScript中的数组拥有三个特性:

 

1.无类型。数组的成员可以是任何类型,同一个数组也可以由很多不同类型的成员所组成。
2.长度可变。数组的长度是可以动态变化的,因此在JavaScript中不存在数组访问的越界问题。
3.不连续性。数组中成员的位置可以是连续的(0, 1, 2, 3…),也可以是不连续的。任何数组都有一个名为length的属性,在数组成员连续的情况下,length值与数组成员数目一致;当数组成员不连续时,length值要大于数组成员的数目。与连续的数组相比,不连续数组的读写性能要差一些。

 

实验:

var o = [42, "Sample Text", {x:88}];//JavaScript array is un-typed.

console.log(o);//[42, "Sample Text", Object {x=88}]

o[3] = 27;//JavaScript array is dynamic.

console.log(o);//[42, "Sample Text", Object {x=88}, 27]

o[5] = 99;//JavaScript array is sparse.

console.log(o);//[42, "Sample Text", Object {x=88}, 27, undefined, 99]

从上面的例子中可以看到,对于不连续的数组,当访问到缺失的那个成员时,JavaScript将返回undefined。如果数组连续,但是其中某个成员为undefined,那么访问数组的结果是一样的:

var a = [42, "Sample Text", {x:88}, 27, undefined, 99];

console.log(a);//[42, "Sample Text", Object {x=88}, 27, undefined, 99]

数组不连续、有成员缺失,跟数组连续、但有成员为undefined,这两种情况下访问数组内容所得到的结果是一样的。但在这两者之间还是存在一些细微的差别,主要表现在对数组key的访问上:

console.log(4 in o);//false

console.log(4 in a);//true

可以看到,这两种情况下虽然访问内容所得到的结果一致,但是其内部机制是完全不同的:在数组不连续的情况下,某个成员缺失,因此当访问该成员时,JavaScript返回了undefined;在数组连续的情况下,所有的成员都存在,只是某些成员的值比较特殊,为undefined而已。

从上面的例子中也可以看到,JavaScript中的数组究其本质只是以数字为key的对象而已,与普通的键值对对象没有任何差别。事实上,在对数组进行读取和写入操作时,JavaScript会试图将参数转换为正整数,如果转换成功则将进行数组操作(自动更新数组的length属性),如果失败则将参数转换成字符串后进行普通对象的读写操作。当然,在JavaScrpt解释器的实现中,针对数组的这种以数字作为key的特性作了很多性能优化,因此在实际使用过程中,如果对象的key都是数字,那么直接使用数组对象会得到更加高效的结果。

在对数组进行定义的过程中,JavaScript允许出现多余的逗号,也允许两个逗号间出现数组成员的缺失:

var x = [1,2,3,];//trailing comma will be omitted.

console.log(x.length);//3

         

var y = [1,,3];//member can be missed.

console.log(y);//[1, undefined, 3]

console.log(1 in y);//false

console.log(y.length);//3

对于数组的创建,JavaScript支持四种方法:

1.使用字面量(如上述几个例子中的中括号表达式)来直接创建数组对象。
2.使用Array()构造函数,不传入任何参数。在这种情况下,将创建一个空数组,其效果与[]等同。
3.使用Array()构造函数,传入一个正整数作为数组的长度。在这种情况下,JavaScript将预留相应的内存空间来存储这个数组。值得注意的是,此时数组的key都是没有被定义的,也即数组中没有任何成员。其效果与[,,,,]这样的写法等同
4.使用Array()构造函数,传入数组的成员。

实验:

var z = new Array(10);//pre-allocate memory, but no index is defined yet.

console.log(3 in z);//false
var m = new Array(42, 33, 99, "test", {k:99});

console.log(m);//[42, 33, 99, "test", Object {k=99}]

在ECMAScript 5标准中,可以用Array.isArray()来判断某个对象是否是数组:
Array.isArray([]);//true

Array.isArray({});//false
Javascript 相关文章推荐
jQuery语法总结和注意事项小结
Nov 11 Javascript
jquery设置按钮停顿3秒不可用
Mar 07 Javascript
用js通过url传参把数据从一个页面传到另一个页面
Sep 01 Javascript
jquery处理json对象
Nov 03 Javascript
分享两个手机访问pc网站自动跳转手机端网站代码
Dec 24 Javascript
jQuery Ajax调用WCF服务详细教程
Mar 31 Javascript
jQuery+CSS实现的网页二级下滑菜单效果
Aug 25 Javascript
Angular中响应式表单的三种更新值方法详析
Aug 22 Javascript
JS如何获取地址栏的参数实例讲解
Oct 06 Javascript
详解Node.JS模块 process
Aug 31 Javascript
Vue实现随机验证码功能
Dec 29 Vue.js
国庆节到了,利用JS实现一个生成国庆风头像的小工具 详解实现过程
Oct 05 Javascript
JavaScript中数组成员的添加、删除介绍
Dec 30 #Javascript
JavaScript 实现打印,打印预览,打印设置
Dec 30 #Javascript
JavaScript中的数组操作介绍
Dec 30 #Javascript
jQuery中:first选择器用法实例
Dec 30 #Javascript
JavaScript中的类数组对象介绍
Dec 30 #Javascript
JavaScript中的方法调用详细介绍
Dec 30 #Javascript
JavaScript中的闭包(Closure)详细介绍
Dec 30 #Javascript
You might like
javascript appendChild,innerHTML,join性能比较代码
2009/08/29 Javascript
jquery+json实现的搜索加分页效果
2010/03/31 Javascript
js定义对象或数组直接量时各浏览器对多余逗号的处理(json)
2011/03/05 Javascript
javascript 获取模态窗口的滚动位置代码
2013/08/06 Javascript
jQuery实现异步获取json数据的2种方式
2014/08/29 Javascript
jquery利用命名空间移除绑定事件的方法
2015/03/11 Javascript
jQuery结合ajax实现动态加载文本内容
2015/05/19 Javascript
在JavaScript中访问字符串的子串
2015/07/07 Javascript
JavaScript结合Bootstrap仿微信后台多图文界面管理
2016/07/22 Javascript
JavaScript实现微信红包算法及问题解决方法
2018/04/26 Javascript
使用JS判断移动端手机横竖屏状态
2018/07/30 Javascript
微信小程序 腾讯地图显示偏差问题解决
2019/07/27 Javascript
React路由鉴权的实现方法
2019/09/05 Javascript
ES6常用小技巧总结【去重、交换、合并、反转、迭代、计算等】
2019/12/21 Javascript
React实现评论的添加和删除
2020/10/20 Javascript
如何在vue中使用kindeditor富文本编辑器
2020/12/19 Vue.js
[19:26]TNC vs EG (BO3)
2018/06/07 DOTA
举例讲解Django中数据模型访问外键值的方法
2015/07/21 Python
Python3字符串学习教程
2015/08/20 Python
在Python中关于使用os模块遍历目录的实现方法
2019/01/03 Python
python进程和线程用法知识点总结
2019/05/28 Python
Django的CVB实例详解
2020/02/10 Python
pycharm软件实现设置自动保存操作
2020/06/08 Python
python爬虫使用requests发送post请求示例详解
2020/08/05 Python
html5使用canvas画空心圆与实心圆
2014/12/15 HTML / CSS
意大利拉斐尔时尚购物网:Raffaello Network(支持中文)
2018/11/09 全球购物
Java里面StringBuilder和StringBuffer有什么区别
2016/06/06 面试题
简单叙述一下MYSQL的优化
2016/05/09 面试题
工程承包协议书
2014/04/22 职场文书
2014国庆节主题活动方案:快乐的国庆节
2014/09/16 职场文书
街道党工委党的群众路线教育实践活动对照检查材料思想汇报
2014/10/05 职场文书
出售房屋协议书范本
2014/10/06 职场文书
四川省传达学习贯彻党的群众路线教育实践活动总结大会精神新闻稿
2014/10/26 职场文书
2015出纳试用期工作总结
2014/12/12 职场文书
元旦主持词开场白
2015/05/29 职场文书
详解nginx安装过程并代理下载服务器文件
2022/02/12 Servers