JS批量创建数组

JavaScript有许多批量创建数组的方法,为了衡量它们的性能,我分别使用不同的方法创建一个长度为100000的数组,且键和值相等。同时,我定义了下面这个函数用来测量创建数组所耗费的时间:

1 function t(fn) {
2     var start = Date.now();
3     fn.call(this);
4     var end = Date.now();
5     return (end - start) + ‘ms‘;
6 }

以下为常用的几个创建数组的方法以及它们所耗费的时间:

使用join和split

该方法把大量时间耗费在了map操作上,去掉map后只需要2ms

使用apply

这里用到了一个{ length: 100000 }伪数组,NodeList和arguments都是伪数组(array-like object),它们都不是真正意义上的数组,而是带有"length属性"并且同时具备"索引属性"的对象,不能直接使用数组的那些方法,而apply和call却可以接受这种伪数组。我们平时在用的Array.prototype.slice( arguments)就是基于这个原理。

这里把长度为100000的伪数组传递给Array函数,构造出了一个长度为100000的数组,然后再用map赋值。有同学可能要问了,为什么不直接Array(100000)生成数组,这是因为通过Array(100000)生成的数组每个值都为undefined,无法通过map遍历。

使用Array.from()

这是ES6新出的方法,可以将伪数组直接转换为数组

如果把伪数组换成数组,速度下降了很多。

使用Array.fill()

先用Array.fill()填充数组,之后再通过map依个赋值

使用for循环

我表示当时就惊呆了,还一直在检查是不是少打个0. 我表示不服,想用push试一下

发现push也好快哦……

比较下来,发现还是最原始的for循环直接赋值的速度最快,其他几个方法速度都差不多。

但for循环写起来实在麻烦,一句话就能搞定的事需要三句才能搞定。

所以,如果对性能没有太大要求的话(毕竟在实际开发中也不会有100000那么大的数组),使用apply和Array.from最方便。

时间: 2024-10-07 15:15:57

JS批量创建数组的相关文章

js中创建数组,并往数组里添加元素

数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度 var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); 创建一个数组并赋值 要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规定长度以

js中创建数组的两种方式

第一种方式:var  array1=new Array(); 第二种方式:var array2=[元素1,元素2,元素3...]; 解析:当只传入一个元素并且是unmber时,这个元素代表的是数组长度. 说明:在JS中有空间在未使用之前,这个空间的类型是不确定的:导致什么类型的数据都可以给其中存放.

js Array 创建具有自定义初始值的数组

在原生js中,创建数组的常见方式有两种:Array() 或 new Array() 和 [] 方式. 构造函数创建数组和字面量定义数组的差异不谈, 当我们需要给创建数组赋初始值时,如果量少的话,可以直接通过 let arr = [2,4] 的方式创建; 而当量大而重复的时候,可以通过以下的方式创建: Array.apply(null,{length:20}).map(()=>2) //(20) [2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2,

0129 JavaScript 数组:概念、创建数组、获取数组中的元素

1.1 数组的概念 数组可以把一组相关的数据一起存放,并提供方便的访问(获取)方式. 数组是指一组数据的集合,其中的每个数据被称作元素,在数组中可以存放任意类型的元素.数组是一种将一组数据存储在单个变量名下的优雅方式. 1.2 创建数组 JS 中创建数组有两种方式: 利用 new 创建数组 var 数组名 = new Array() : var arr = new Array(); // 创建一个新的空数组 注意 Array () ,A 要大写 利用数组字面量创建数组 //1. 使用数组字面量方

JS中Array数组的三大属性用法

Array数组主要有3大属性,它们分别是length属性.prototype属性和constructor属性. JS操作Array数组的方法及属性 本文总结了Array数组的3个属性,length属性.prototype属性.constructor属性使用,并附注Array数组对象的8个分类及多个方法使用,具体如下: 对象的3个属性 1.length属性 length属性 Length属性表示数组的长度,即其中元素的个数.因为数组的索引总是由0开始,所以一个数组的上下限分别是:0和length-

Azure PowerShell批量创建Azure虚拟机

在我们工作过程当中,可能会需要创建多台相同配置的虚拟机.我们是不是只能通过Portal 页面一台台创建呢?答案是否定的,我们可以通过Azure PowerShell脚本来批量创建虚拟机.接下来我将介绍通过Powershell来批量创建Azure虚拟机. 以下分割线内的内容是要powershell脚本用来批量创建虚拟机的内容 ---------------------------------------分割线---------------------------------------------

JS函数,数组,日期

函数是JS的一个重点,函数就是代码复用的一种机制或是将代码封装成功能的代码段,函数一共有两种定义方式函数声明的方式定义一个函数function + 函数名:一般用单词的动词,例如getMax... +参数列表:此处一般是形参也可以是一个函数){函数体:可执行的代码函数后面可以有一个return;(return后面加上需要返回的值,如果没有写return或者return后面没有写返回值,那么函数最后返回undefined,当没有return的时候,函数只是为了执行代码,return语句下面不要加代

JS学习笔记-数组

ECMAScript中没有提供类和接口等的定义,但它却是一门面向对象的语言,由于它能够通过其它 方式实现类似高级语言的面向对象功能,这些内容将在后面的文章中进行一步步的总结.此篇仅对JS中对象作简要说明,重点汇总一些类似于对象的数组的经常用法. 对象 创建 上篇提到创建对象的两种方式: 使用new运算符创建Object var obj = new Object(); 使用字面量方式创建 var   obj = {}; 这里值得注意的是在使用字面量(常量)创建Object时不会调用构造函数. 属性

javascript创建数组的几种方式

1.单纯创建JavaScript数组: vararr=newArray(); 要点:用new关键字创建数组对象Array(),Array()对象是一个本地类,可以用new创建一个对象后使用 2.创建JavaScript数组的同时规定数组大小: vararr=newArray(10);//这里就创建了一个初始化大小为10的数组 注意:当使用数组大小操作初始化大小时,数组会自动被撑大,不会像C语言那样发生错误.动态增长是js数组的一个性质.另外,js中支持最大数组长度为4294967295 3.直接