javascript稀疏数组(sparse array)和密集数组用法分析


Posted in Javascript onDecember 28, 2016

本文实例讲述了javascript稀疏数组(sparse array)和密集数组用法。分享给大家供大家参考,具体如下:

学习underscore.js数组相关API的时候,遇到了sparse array这个东西,以前没有接触过。

这里学习下什么是稀疏数组和密集数组。

什么是密集数组呢?在Java和C语言中,数组是一片连续的存储空间,有着固定的长度。加入数组其实位置是address,长度为n,那么占用的存储空间是address[0],address[1],address[2].......address[n-1]。即数组元素之间是紧密相连的,不存在空隙。如下的js代码创建的就是一个密集数组

var data = [3,1,6,9,2];

什么是稀疏数组呢?与密集数组相反,javascript并不强制要求数组元素是紧密相连的,即允许间隙的存在。如下的js代码是合法的:

var sparse = new Array();
sparse[0] = 0;
sparse[3] = 3;
alert(sparse[0]);//输出0
alert(sparse[1]);//输出undefined

1、创建稀疏数组

如下代码创建了一个固定长度的稀疏数组

var a = new Array(3);
a[2] = 1;
alert(a[0]);//undefined
alert(a[2]);//1

说白了js中建立稀疏数组很容易,只要你故意让数组元素之间存在间隙即可。如

var arr = [];
arr[0] = 0;
arr[200] = 200;

2、创建密集数组

可以看到js中的数组一般都是稀疏的,一般来说稀疏数组的遍历比较麻烦。

var dense = Array.apply(null, Array(3));

这行代码等同于var  dense = Array(undefined, undefined, undefined) ;呵呵是不是觉得很奇怪,这种方式跟稀疏数组没有什么差别。看代码:

//稀疏数组
var array = new Array(3);
array[2] = "name";
for(var a in array)
{
  console.log("index=" + a + ",value=" + array[a]);
}
// 密集数组
var dense = Array.apply(null, Array(3));
dense[2] = "name";
for(var a in dense)
{
  console.log("index=" + a + ",value=" + dense[a]);
}

用F12观察控制台输出结果是:

javascript稀疏数组(sparse array)和密集数组用法分析

可以看到确实是有差别的:稀疏数组只遍历了一次(因为只有一个元素),密集数组遍历了3次。

3、总结

JavaScript中的数组并不像我们在C或java等语言中遇到的常规数组,在js中数组并不是起始地址+长度构成的一片连续的地址空间。

javascript中数组其实就是个对象,只不过会自动管理一些"数字"属性和length属性罢了。

说的更直接一点,JavaScript中的数组根本没有索引,因为索引应该是数字,而JavaScript中数组的索引其实是字符串。

arr[1]其实就是arr["1"],给arr["1000"] = 1,arr.length也会自动变为1001。

这些表现的根本原因就是:JavaScript中的对象就是字符串到任意值的键值对。

虽然稀疏数组和密集数组差别不大,javascript也没有语法强制数组是稀疏的还是密集的,这不过是概念上的区分。

最佳实践是:就把js数组当成是java或C中的数组,由我们程序员来负责让js的数组元素是连续的。

var array = [1,2,3,4];

如:

var array = new Array();array[0]=0;array[1]=1;

这样创建的js数组,就符合我们熟悉的数组了。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
些很实用且必用的小脚本代码
Jun 26 Javascript
json跟xml的对比分析
Jun 10 Javascript
Extjs ajax同步请求时post方式参数发送方式
Aug 05 Javascript
10个基于jQuery或JavaScript的WYSIWYG 编辑器整理
May 06 Javascript
验证码在IE中不刷新而谷歌等浏览器正常的解决方案
Mar 18 Javascript
使用javascript实现Iframe自适应高度
Dec 24 Javascript
jQuery基础知识点总结(DOM操作)
Jun 01 Javascript
JS中sort函数排序用法实例分析
Jun 16 Javascript
vue图片加载与显示默认图片实例代码
Mar 16 Javascript
js 用于检测类数组对象的函数方法
May 02 Javascript
关于ES6尾调用优化的使用
Sep 11 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
Dec 28 Javascript
JS中闭包的经典用法小结(2则示例)
Dec 28 #Javascript
AngularJS实现网站换肤实例
Feb 19 #Javascript
详解js树形控件—zTree使用总结
Dec 28 #Javascript
js 轮播效果实例分享
Dec 28 #Javascript
JS正则RegExp.test()使用注意事项(不具有重复性)
Dec 28 #Javascript
Bootstrap 模态框实例插件案例分析
Dec 28 #Javascript
Angular使用ng-messages与PHP进行表单数据验证
Dec 28 #Javascript
You might like
一个简单php扩展介绍与开发教程
2010/08/19 PHP
PHP面向对象概念
2011/11/06 PHP
关于PHP文件的自动运行方法分析
2016/05/13 PHP
PHP实现基于面向对象的mysqli扩展库增删改查操作工具类
2017/07/18 PHP
用javascript实现点击链接弹出"图片另存为"而不是直接打开
2007/08/15 Javascript
JQUERY THICKBOX弹出层插件
2008/08/30 Javascript
JavaScript访问样式表代码
2010/10/15 Javascript
jQuery插件StickUp实现网页导航置顶
2015/04/12 Javascript
深入浅出分析javaScript中this用法
2015/05/09 Javascript
基于jQuery实现收缩展开功能
2016/03/18 Javascript
JS控制TreeView的结点选择
2016/11/11 Javascript
jQuery实现模糊搜索功能的方法分析
2018/06/29 jQuery
使用RxJS更优雅地进行定时请求详析
2019/06/02 Javascript
解决vue更新路由router-view复用组件内容不刷新的问题
2019/11/04 Javascript
vue 解决兄弟组件、跨组件深层次的通信操作
2020/07/27 Javascript
python获得一个月有多少天的方法
2015/06/04 Python
Python标准库笔记struct模块的使用
2018/02/22 Python
tensorflow实现图像的裁剪和填充方法
2018/07/27 Python
Python中GIL的使用详解
2018/10/03 Python
Python骚操作之动态定义函数
2019/03/26 Python
浅谈Python中(&,|)和(and,or)之间的区别
2019/08/07 Python
使用Python的turtle模块画国旗
2019/09/24 Python
Python实现数值积分方式
2019/11/20 Python
详解Windows下PyCharm安装Numpy包及无法安装问题解决方案
2020/06/18 Python
django中cookiecutter的使用教程
2020/12/03 Python
Jupyter安装拓展nbextensions及解决官网下载慢的问题
2021/03/03 Python
Python 求向量的余弦值操作
2021/03/04 Python
CSS3——齿轮转动关键代码
2013/05/02 HTML / CSS
AE美国鹰美国官方网站:American Eagle Outfitters
2016/08/22 全球购物
来自世界上最好大学的在线课程:edX
2018/10/16 全球购物
中科方德软件测试面试题
2016/04/21 面试题
优秀毕业生求职信范文
2014/01/02 职场文书
初三学生评语大全
2014/04/24 职场文书
就业协议书盖章的注意事项
2014/09/28 职场文书
免职证明样本
2014/10/23 职场文书
Python+pyaudio实现音频控制示例详解
2022/07/23 Python