JS数组在内存中的效率问题浅析

目录
  • JS数组
  • 效率比较
  • 举个栗子
  • 非连续内存问题
  • 总结

JS数组

我们所熟知的JS数组的结构和其他语言数组结构类似，即物理内存是连续的，所以这也就导致了数组成员移动次数越少，其效率越高，一般数组会被分配到一段连续的内存中，像这样

大家可能会疑问，你为啥要给画一个边框呢，其实我们的数组在定义的时候默认了它的长度，即当我们像要在数组中添加元素的时候，就需要对它的长度做出改变。

效率比较

JS提供了几个api来让我们便捷地向数组中添加元素，比如说push，unshift

  • push()是添加一个元素在数组的末尾，这里我们无需操作其他的元素，只需要this,length+=1即可
  • unshift()是在数组的头部添加一个元素，我们看到的仅仅只要其表面数组的头部增加了一个元素，其实底层数组的中的所有成员都需要向后移动，从尾到头的顺序，如下所示，其就会凸显出性能差的特点。

举个栗子

我们下面写个栗子来清晰得比较一下两者所耗费的时间，我们的unshift耗费了0.24毫秒，push耗费了0.8毫秒，当然所耗费的时间还是根据所移动的元素数量来以指数倍提高的。

function _shift() {
    var arr = []
    console.time('_shift')
    for (let i = 0; i < 1000; i++) {
      arr.unshift(1)
    }
    console.timeEnd('_shift')
  }
  _shift()
function _push() {
    var arr = []
    console.time('_push')
    for (let i = 0; i < 1000; i++) {
      arr.push(1)
    }
    console.timeEnd('_push')
  }
  _push()

非连续内存问题

除此之外我们都知道JS数组是可以在同一数组中存储不同数据类型的数据的，所以就造成了JS的数组是否分配连续内存，是要看我们的数组成员类型的，当数组内成员为同一类，则为连续内存，当数组成员存在数组，字符串，那么就会分配非连续的内存，多个非连续内存会形成一个链表，当存储数据数量级庞大的时候，就会造成效率低下的问题。下面我们针对数组成员相同和数组成员不同进行一次耗时比较，为了凸显效果我将次数提高到了10的7次幂

  function _diff() {
    var arr = new Array(10000000)
    arr.push({ name: "cxy" })
    console.time('_diff')
    for (let i = 0; i < 10000000; i++) {
      arr[i] = i
    }
    console.timeEnd('_diff')
  }
  _diff()
  function _same() {
    var arr = new Array(10000000)
    console.time('_same')
    for (let i = 0; i < 10000000; i++) {
      arr[i] = i
    }
    console.timeEnd('_same')
  }
  _same()

最后可以清楚地比较出两者的差距，非连续内存的数组操作耗时是连续内存的数组的几倍。

总结

到此这篇关于JS数组在内存中的效率问题的文章就介绍到这了,更多相关JS数组在内存的效率内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • 如何高效率去掉js数组中的重复项

    如何高效率去掉js数组中的重复项

    方式一: 常规模式 1.构建一个新的临时数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与临时数组对比 3.若临时数组中没有该元素,则存到临时数组中 方式二: 使用了默认Js数组sort默认排序,是按ASCII进行排序: 若要按照升降序的排列如下:<控制台打印输出> 1.先将当前数组进行排序 2.检查当前中的第i个元素 与 临时数组中的最后一个元素是否相同,因为已经排序,所以重复元素会在相邻位置 3.如果不相同,则将该元素存入结果数组中 方式三: <推荐>利

  • JavaScript判断是否为数组的3种方法及效率比较

    JavaScript判断是否为数组的3种方法及效率比较

    今天针对不同的数组判定方式在chrome上做了一个效率的对比,结果如下: 其代码如下: var ret; var o = [1,2,3]; var toStr = {}.toString; var array = {}; array["[object Array]"] = "array"; console.log("各种判断是否数组的速度比较!") console.log("方法一:Array.isArray(o)"); co

  • js实现数组去重方法及效率對比

    其實網上搜索這些方法一堆堆的,之所以還來寫一遍主要是因爲自己習慣一種之後就忘了其他方法怎麽實現,就寫一寫總結一下,順便做個測試看看哪個效率最高,爲了更好展示效果,我會先總結認爲比較好的方法,後面統一測試.(溫馨提示:下文衹是爲了簡便,一般情況下不建議寫在原型上,容易污染全局) 一,通過尋找對象屬性 var n = [14,12,2,2,2,5,32,2,59,5,6,33,12,32,6]; Array.prototype.unique1 = function(){ var obj = {},

  • JavaScript数组去重的几种方法效率测试

    JavaScript数组去重的几种方法效率测试

    以下是我针对网上三种高效率方法总结与效率测试,如果大家有更好的意见或建议也可以提出,大家共勉学习. 数组去重法1: Array.prototype.unique1 = function(){ console.time("数组去重法1"); //记录开始执行的时间 var arr = []; //创建一个临时数组 var obj = {}; //创建一个空对象 for(var i = 0; i < this.length; i++){ //遍历当前要去重的数组 if(!obj[th

  • JS数组在内存中的效率问题浅析

    JS数组在内存中的效率问题浅析

    目录 JS数组 效率比较 举个栗子 非连续内存问题 总结 JS数组 我们所熟知的JS数组的结构和其他语言数组结构类似,即物理内存是连续的,所以这也就导致了数组成员移动次数越少,其效率越高,一般数组会被分配到一段连续的内存中,像这样 大家可能会疑问,你为啥要给画一个边框呢,其实我们的数组在定义的时候默认了它的长度,即当我们像要在数组中添加元素的时候,就需要对它的长度做出改变. 效率比较 JS提供了几个api来让我们便捷地向数组中添加元素,比如说push,unshift push()是添加一个元素在

  • 详解Java中一维、二维数组在内存中的结构

    详解Java中一维、二维数组在内存中的结构

    前言 我们知道在Java中数组属于引用数据类型,它整个数组的数组元素既可以是基本数据类型的(如 byte \ int \ short \ long \ float \ double \ char \ boolean 这些),也可以是引用数据类型的.当它的数组元素是基本数据类型时,这个数组就是一个一维数组:当它的数组元素是引用数据类型时,它就是一个多维数组.比如,在一个数组中它的某个元素值其实是一个一维数组,而其他不同的元素也各自包含了一个一维数组,我们就把这个包含很多个一维数组的数组叫做二维数组

  • JS数组索引检测中的数据类型问题详解

    JS数组索引检测中的数据类型问题详解

    之前在写微信小程序项目时,里面有一个"城市选择"的功能,笔者用的是 <picker-view> 组件,这个组件比较特别,因为它的 value 属性规定是 数组 格式的.比如: value="[1]". 因为当时对JS变量类型转换的不了解,笔者在代码中写下了这样的几行判断:(这是严谨的) let val_one=typeof this.data.pIndex=="number"?[this.daya.pIndex]:this.data.

  • Java中数组在内存中存放原理的讲解

    Java中数组在内存中存放原理的讲解

    Java中数组被实现为对象,它们一般都会因为记录长度而需要额外的内存.对于一个原始数据类型的数组,一般需要24字节的头信息再加上保存值所需的内存,其中24字节的头信息分别包含以下几个部分. 下面分别分析一维.二维.三维的数组存储情况. 下面首先对一维数组进行分析,以int[]型数组为例,假设数组长度为N,那么需要的内存占用(24+4N)个字节,原因分析比较简单,图解示例如下:即占用内存总量=头信息内存+数组N个int值占用内存. 对于二维数组进行分析,首先对于多维数组的概念,大家可以参考这篇文章

  • JS数组循环的方式以及效率分析对比

    JS数组循环的方式以及效率分析对比

    数组的方法 JavaScript发展到现在已经提供了许多数组的方法,下面这张图涵盖了数组大部分的方法,这篇文章主要说一说数组的遍历方法,以及各自的性能,方法这么多,如何挑选性能最佳的方法对我们的开发有非常大的帮助. 数组遍历的方法 for 标准的for循环语句,也是最传统的循环语句 var arr = [1,2,3,4,5] for(var i=0;i<arr.length;i++){ console.log(arr[i]) } 最简单的一种遍历方式,也是使用频率最高的,性能较好,但还能优化 优

  • JS实现数组简单去重及数组根据对象中的元素去重操作示例

    本文实例讲述了JS实现数组简单去重及数组根据对象中的元素去重操作.分享给大家供大家参考,具体如下: js数组简单去重 var arr1 = [1, 2, 3, 4, 5, 6, 3, 4, 3]; function arrayUnique1(arr) { var result = [], hash = {}; for (var i = 0, elem; (elem = arr[i]) != null; i++) { if (!hash[elem]) { result.push(elem); ha

  • Android加载大分辨率图片到手机内存中的实例方法

    Android加载大分辨率图片到手机内存中的实例方法

    还原堆内存溢出的错误首先来还原一下堆内存溢出的错误.首先在SD卡上放一张照片,分辨率为(3776 X 2520),大小为3.88MB,是我自己用相机拍的一张照片.应用的布局很简单,一个Button一个ImageView,然后按照常规的方式,使用BitmapFactory加载一张照片并使用一个ImageView展示. 代码如下: 复制代码 代码如下: btn_loadimage.setOnClickListener(new View.OnClickListener() { @Override   

  • C语言之关于二维数组在函数中的调用问题

    C语言之关于二维数组在函数中的调用问题

    目录 关于二维数组在函数中的调用问题 函数调用二维数组 二维数组如何放到函数中使用 下面以一个二维矩阵的转置为例 关于二维数组在函数中的调用问题 之前在学习二维数组的时候感觉理解起来很简单,所以理解一下就过去了,但是当自己真正的去用二维数组数组解决一些问题(特别是在函数调用二维数组的过程中)才真正发现原来使用起来还是要去注意一些细节的.废话不多说,直接上干货! 函数调用二维数组 在函数中调用二维数组的具体格式如下: 1.声明:这是声明的两种格式,在这里定义的是一个N*5的二维字符数组,各位看官一

  • 数组在java中的扩容的实例方法

    在使用数组的时候,因为大小的限制,难免会出现不够用的现象.直接给数据对象扩容是不可行的,这时候就需要我们找寻一些其他的方法.本篇先为大家简单分析扩容的原理,然后创建一个数组供大家使用,最后提供两种数组扩容方法:for循环和Arrays,下面一起来看具体的操作. 1.扩容的原理 (1)Java数组对象的大小是固定不变的,数组对象是不可扩容的. (2)利用数组复制方法可以变通的实现数组扩容. (3)System.arraycopy()可以复制数组. (4)Arrays.copyOf()可以简便的创建

随机推荐