理解JS里的稀疏数组与密集数组
一般来说,JavaScript中的数组是稀疏的。
什么是稀疏呢?稀疏也就是说,数组中的元素之间可以有空隙,因为一个数组其实就是一个键值映射。本文解释了如何创建稀疏数组和不稀疏的数组。
1、稀疏数组
创建一个指定长度的稀疏数组很简单:
当你遍历它时,你会发现,它并没有元素,JavaScript会跳过这些缝隙。
还有一些其他情况会生成稀疏数组,比如:
,数组元素实际只有2个,但是长度确实101。
2、密集数组
1、创建密集数组的技巧:var a = Array.apply(null, Array(3));

//上面的语句其实等同于:
Array(undefined, undefined, undefined)
你现在可以看到数组里面有真实元素了,虽然元素的值是undefined,但是你可以遍历到这些数组元素了,还可以为每个元素重新赋值:

实际上,JavaScript并没有常规的数组,所有的数组其实就是个对象,只不过会自动管理一些"数字"属性和length属性罢了。
说的更直接一点,JavaScript中的数组根本没有索引,因为索引应该是数字,而JavaScript中数组的索引其实是字符串:arr[1]其实就是arr["1"],给arr["1000"] = 1,arr.length也会自动变为1001。
这些表现的根本原因就是:JavaScript中的对象就是字符串到任意值的键值对。注意键只能是字符串。这和AWK类似,不信可以试试awk 'BEGIN{a[1]=1;print(a["1"])}'。也许这是因为Brendan Eich在发明JavaScript时参考了不少awk的设计的原因。不过目前,ES6中已经有了类似于Java等语言的Map类型,键可以是任意类型的值。
2、另外一个技巧:
Array.apply(null, Array()).map(Function.prototype.call.bind(Number))
//[ 0, 1, 2 ]
这大概等同于下面的写法
Array.apply(null, Array()).map(
function (x,i,...) { return Number.call(x,i,...) })
注意:x是call方法的第一个参数,它作为了Number函数中的this值。这个值没有什么意义,相当于被忽略,我更喜欢下面这个能让人一眼就看明白的写法
Array.apply(null, Array()).map(function (x,i) { return i })
3、另外一种方式,突然想到之前这么转化过,这样来也是个密集数组。
在JavaScript中,可以用Array(100).join("a")来创建密集数据。但是有个问题就是两个元素才1个坑,因为2个才能join。100个元素就需要101个。我们可以看下

3、实际用途
在实际生产中,使用上面讲的创建密集数组的方法会让别人无法读懂你的代码。所以封装成一个工具函数会更好
//比如 _.range:
_.range() //[ 0, 1, 2 ] //和map配合使用,可以使用某个指定的值填充整个数组。
_.range().map(function () { return "a" })
//[ 'a', 'a', 'a' ]
理解JS里的稀疏数组与密集数组的更多相关文章
- js中的稀疏数组和密集数组
原文地址: http://www.2ality.com/2012/06/dense-arrays.html 一般来说JavaScript中的数组都是稀疏的,也就是说数组中的元素与元素之间是由空格的,因 ...
- javascript中稀疏数组和密集数组
密集数组 数组是一片连续的存储空间,有着固定的长度.加入数组其实位置是address,长度为n,那么占用的存储空间是address[0],address[1],address[2].......add ...
- 读lodash源码之从slice看稀疏数组与密集数组
卑鄙是卑鄙者的通行证,高尚是高尚者的墓志铭. --北岛<回答> 看北岛就是从这两句诗开始的,高尚者已死,只剩卑鄙者在世间横行. 本文为读 lodash 源码的第一篇,后续文章会更新到这个仓 ...
- js里的稀疏数组
今天在逛掘金网站的时候,在一篇文章里学到一个新名字,稀疏数组,特此记录一下. 稀疏数组就是包含从0开始的不连续索引的数组.也就是说数组中大部分的内容值都未被使用(或都为零). var arr = ne ...
- 我这样理解js里的this
关于this,是很多前端面试必考的题目,有时候在网上看到这些题目,自己试了一下,额,还真的错了!在实际开发中,也会遇到 this 的问题(虽然一些类库会帮我们处理),例如在使用一些框架的时候,例如:k ...
- 深入理解js里面的this
闲聊两句(可以忽略): 毕业有半年了,时间还过得真快,不过还好,感觉自己相对于刚毕业那会确实成长了很多:好久没有打游戏了(自己决心要戒掉的),消磨时光的时候就看看电影或者追追电视剧,再无聊就洗洗衣服. ...
- 理解JS里的偏函数与柯里化
联系到上篇博客讲的bind完整的语法为: let bound = func.bind(context, arg1, arg2, ...); 可以绑定上下文this和函数的初始参数.举例,我们有个乘法函 ...
- javascript中的稀疏数组(sparse array)和密集数组
学习underscore.js数组相关API的时候.遇到了sparse array这个东西,曾经没有接触过. 这里学习下什么是稀疏数组和密集数组. 什么是密集数组呢?在java和C语言中,数组是一片连 ...
- 深入理解Js数组
深入理解Js数组 在Js中数组存在两种形式,一种是与C/C++等相同的在连续内存中存放数据的快数组,另一种是HashTable结构的慢数组,是一种典型的字典形式. 描述 在本文中所有的测试都是基于V8 ...
随机推荐
- 《深入浅出MyBatis技术原理与实战》——4. 映射器,5. 动态SQL
4.1 映射器的主要元素 4.2 select元素 4.2.2 简易数据类型的例子 例如,我们需要统计一个姓氏的用户数量.应该把姓氏作为参数传递,而将结果设置为整型返回给调用者,如: 4.2.3 自动 ...
- 微信小程序 - video组件poster无效 / 视频播放列表
在做有关微信小程序有关视频播放页面的时候,遇到video组件设置poster无效果,然后查了下poster属性:视频封面的图片网络资源地址,如果 controls 属性值为 false 则设置 pos ...
- Vuex ~ 初识
状态:data中的属性需要共享给其他vue组件使用的部分(即data中需要共用的属性) 1.初识vuex直接来个小demo 下面操作都是基于vue-cli,如果不了解先学习下vue-cli 利用n ...
- javascript大神修炼记(1)——入门介绍
读者朋友们好,从今天开始,我将带领新朋友们,从了解javascript开始,一步一步地进阶到大神境界,别的不废话,现在开始,我们就一点一点地从入门阶段开始. 我们还是介绍一下javascript的身世 ...
- Codeforces Round #496 (Div. 3) E2 - Median on Segments (General Case Edition)
E2 - Median on Segments (General Case Edition) 题目大意:给你一个数组,求以m为中位数的区间个数. 思路:很巧秒的转换,我们把<= m 数记为1, ...
- php获取不到url问号之后的参数
url规则已定义: RewriteRule ^/member/editprivilege/([0-9]+) /access.php?_u=mobile/editprivilege&aid=$1 ...
- Python 实现腾讯新闻抓取
原文地址:http://www.cnblogs.com/rails3/archive/2012/08/14/2636780.htm 思路: 1.抓取腾讯新闻列表页面: http://news.qq.c ...
- 2018CCPC 中国大学生程序设计竞赛 网络赛
链接 1.括号序列贪心/CF&51nod原题 [分析]: 贪心,每次到i的时候,假如你要在i里面要卖掉股票,获益是a[i], 肯定要在前面要么:1)把已经卖了的变成不买不卖,需要-a[j], ...
- Python开发基础-Day1-python入门
编程语言分类 机器语言 使用二进制代码直接编程,直接与硬件交互,执行速度非常快,灵活,但是开发难度高,开发效率低下,缺乏移植性. 汇编语言 对机器语言指令进行了英文封装,较机器语言容易记忆,直接与硬件 ...
- J2EE并发策略控制总结[zz]
本文结合hibernate以及JPA标准,对J2EE当前持久层设计所遇到的几个问题进行总结: 第一:事务并发访问控制策略 当前J2EE项目中,面临的一个共同问题就是如果控制事务的并发访问,虽然有 ...