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 相关文章推荐
JavaScript下申明对象的几种方法小结
Oct 02 Javascript
javascript Select标记中options操作方法集合
Oct 22 Javascript
jquery实现html页面 div 假分页有原理有代码
Sep 06 Javascript
JavaScript使用addEventListener添加事件监听用法实例
Jun 01 Javascript
使用JS在浏览器中判断当前网络连接状态的几种方法
May 05 Javascript
Vue.js实现价格计算器功能
Mar 30 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
Sep 28 Javascript
微信小程序如何使用canvas二维码保存至手机相册
Jul 15 Javascript
vue.js购物车添加商品组件的方法
Sep 17 Javascript
微信小程序实现蒙版弹出窗功能
Sep 17 Javascript
微信小程序实现侧边栏分类
Oct 21 Javascript
vue使用keep-alive实现组件切换时保存原组件数据方法
Oct 30 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 session_start()关于Cannot send session cache limiter - headers already sent错误解决方法
2009/11/27 PHP
php中session使用示例
2014/03/29 PHP
PHP程序中使用adodb连接不同数据库的代码实例
2015/12/19 PHP
[原创]php token使用与验证示例【测试可用】
2017/08/30 PHP
PHP实现简单计算器小程序
2020/08/28 PHP
javascript parseInt 大改造
2009/09/27 Javascript
jquery实现点击弹出层效果的简单实例
2014/03/03 Javascript
JavaScript获取网页支持表单字符集的方法
2015/04/02 Javascript
浅析JavaScript动画
2015/06/10 Javascript
js实现带有介绍的Select列表菜单实例
2015/08/18 Javascript
关于axios返回空对象的问题解决
2017/04/04 Javascript
浅谈react受控组件与非受控组件(小结)
2018/02/09 Javascript
vue将对象新增的属性添加到检测序列的方法
2018/02/24 Javascript
p5.js入门教程之鼠标交互的示例
2018/03/16 Javascript
解决百度Echarts图表坐标轴越界的方法
2018/10/17 Javascript
layer.js open 隐藏滚动条的例子
2019/09/05 Javascript
基于layui轮播图满屏是高度自适应的解决方法
2019/09/16 Javascript
create-react-app中添加less支持的实现
2019/11/15 Javascript
[30:55]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第二场 11.18
2020/11/18 DOTA
python3序列化与反序列化用法实例
2015/05/26 Python
不要用强制方法杀掉python线程
2017/02/26 Python
python按综合、销量排序抓取100页的淘宝商品列表信息
2018/02/24 Python
python实现顺时针打印矩阵
2019/03/02 Python
python实现串口自动触发工作的示例
2019/07/02 Python
python计算无向图节点度的实例代码
2019/11/22 Python
Python装饰器原理与基本用法分析
2020/01/07 Python
Python startswith()和endswith() 方法原理解析
2020/04/28 Python
Python 执行矩阵与线性代数运算
2020/08/01 Python
Ado与Ado.net的相同与不同
2014/12/08 面试题
EJB的角色和三个对象
2015/12/31 面试题
自我鉴定的范文
2013/10/03 职场文书
文明倡议书范文
2014/04/15 职场文书
新郎答谢词
2015/01/04 职场文书
2016关于学习党章的心得体会
2016/01/15 职场文书
Redis基于Bitmap实现用户签到功能
2021/06/20 Redis
Python+Tkinter制作专属图形化界面
2022/04/01 Python