理解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(3)).map(Function.prototype.call.bind(Number))
//[ 0, 1, 2 ]

  这大概等同于下面的写法

Array.apply(null, Array(3)).map(
    function (x,i,...) { return Number.call(x,i,...) })

  注意:x是call方法的第一个参数,它作为了Number函数中的this值。这个值没有什么意义,相当于被忽略,我更喜欢下面这个能让人一眼就看明白的写法

Array.apply(null, Array(3)).map(function (x,i) { return i })

  3、另外一种方式,突然想到之前这么转化过,这样来也是个密集数组。

  在JavaScript中,可以用Array(100).join("a")来创建密集数据。但是有个问题就是两个元素才1个坑,因为2个才能join。100个元素就需要101个。我们可以看下

3、实际用途

  在实际生产中,使用上面讲的创建密集数组的方法会让别人无法读懂你的代码。所以封装成一个工具函数会更好

//比如 _.range:
 _.range(3)    //[ 0, 1, 2 ]

//和map配合使用,可以使用某个指定的值填充整个数组。
 _.range(3).map(function () { return "a" })
//[ ‘a‘, ‘a‘, ‘a‘ ]

原文地址:https://www.cnblogs.com/goloving/p/8686780.html

时间: 2024-11-09 15:25:50

理解JS里的稀疏数组与密集数组的相关文章

我这样理解js里的this

关于this,是很多前端面试必考的题目,有时候在网上看到这些题目,自己试了一下,额,还真的错了!在实际开发中,也会遇到 this 的问题(虽然一些类库会帮我们处理),例如在使用一些框架的时候,例如:knockout,有时候不明白为什么不直接使用this,而要把 this 作为参数传入. 接下来你谈谈我对它的理解,也作为一个笔记,方便以后参阅.有不对的地方,欢迎指出批评. 1. 不像C#,this一定是指向当前对象.js的this指向是不确定的,也就是说是可以动态改变的.call/apply 就是

深入理解js里面的this

闲聊两句(可以忽略): 毕业有半年了,时间还过得真快,不过还好,感觉自己相对于刚毕业那会确实成长了很多:好久没有打游戏了(自己决心要戒掉的),消磨时光的时候就看看电影或者追追电视剧,再无聊就洗洗衣服.扫扫地,实在不行就拿起手边的书看.照我以前的习惯,我除了上课时间可能看书,其他的时间是完全看不进的,所以觉得这也是自己进步的地方. 最近自己想开始学习前端工程师现在最流行的东西,nodejs,听说可以写服务端.听说是事件驱动.听说...听说了很多很多关于它的好,所以我也决心要好好学这个.推荐我收集的

javascript中的稀疏数组(sparse array)和密集数组

学习underscore.js数组相关API的时候,遇到了sparse array这个东西,以前没有接触过. 这里学习下什么是稀疏数组和密集数组. 什么是密集数组呢?在java和C语言中,数组是一片连续的存储空间,有着固定的长度.加入数组其实位置是address,长度为n,那么占用的存储空间是address[0],address[1],address[2].......address[n-1].即数组元素之间是紧密相连的,不存在空隙.如下的js代码创建的就是一个密集数组 var data = [

理解 Node.js 里的 process.nextTick()

有很多人对Node.js里process.nextTick()的用法感到不理解,下面我们就来看一下process.nextTick()到底是什么,该如何使用. Node.js是单线程的,除了系统IO之外,在它的事件轮询过程中,同一时间只会处理一个事件.你可以把事件轮询想象成一个大的队列,在每个时间点上,系统只会处理一个事件.即使你的电脑有多个CPU核心,你也无法同时并行的处理多个事件.但也就是这种特性使得node.js适合处理I/O型的应用,不适合那种CPU运算型的应用.在每个I/O型的应用中,

JS里的居民们8-对象和数组转换

编码 学习通用的数据用不同的数据结构进行存储,以及相互的转换 对象转为数组: var scoreObject = { "Tony": { "Math": 95, "English": 79, "Music": 68 }, "Simon": { "Math": 100, "English": 95, "Music": 98 }, "Anni

谈谈JS里的{ }大括号和[ ]中括号的用法

谈谈JS里的{ }大括号和[ ]中括号的用法,理解后就可以看懂JSON结构了. 一.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数. 如:var LangShen = {"Name":"Langshen","AGE":"28"}; 上面声明了一个名为"LangShen"的对象,多个属性或函数用,(逗号)隔开,因为是对象的属性, 所以访问时,应该用.(点)来层层访问:LangShe

理解JS中的call、apply、bind方法

理解JS中的call.apply.bind方法(*****************************************************************) 在JavaScript中,call.apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向. call.apply.bind方法的共同点和区别:apply . call .bind 三者都是用来改变函数的this对象的指向的:apply . call .bind 三者

js 的数组怎么push一个对象. Js数组的操作push,pop,shift,unshift JavaScript使用push方法添加一个元素到数组末 JavaScript数组函数unshift、shift、pop、push使用

push()函数用于向当前数组的添加一个或多个元素,并返回新的数组长度.新的元素将会依次添加到数组的末尾. 该函数属于Array对象,所有主流浏览器均支持该函数. 语法 array.push( item1 [,items... ] )参数 参数 描述item1 任意类型添加到当前数组末尾处的元素.items 可选参数/任意类型要添加到当前数组末尾处的其他项,可以有多个.注意:如果添加的元素类型为数组类型(Array),仍然会被当作一个元素看待,只是这个元素是数组类型而已.如果要合并两个数组,请使

深入理解 js this 绑定 ( 无需死记硬背,尾部有总结和面试题解析 )

js 的 this 绑定问题,让多数新手懵逼,部分老手觉得恶心,这是因为this的绑定 '难以捉摸',出错的时候还往往不知道为什么,相当反逻辑.让我们考虑下面代码: var people = { name : "海洋饼干", getName : function(){ console.log(this.name); } }; window.onload = function(){ xxx.onclick = people.getName; }; 在平时搬砖时比较常见的this绑定问题,