JavaScript 批量创建数组的方法

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

 function t(fn) {
   var start = Date.now();
   fn.call(this);
   var end = Date.now();
   return (end - start) + 'ms';
}

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

使用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最方便。

以上所述是小编给大家介绍的JavaScript 批量创建数组的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • javascript创建数组之联合数组的使用方法示例

    复制代码 代码如下: //js中的数组可以以键值对的方式存在        var arr = new Array();        arr["A"] = "boss";        arr["B"] = "Emp";        for (var m in arr) {            document.write(arr[m] + " ");        }        var pers

  • asp.net通过js实现Cookie创建以及清除Cookie数组的代码

    复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="BLTZ.aspx.cs" Inherits="BLTZ" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1

  • js创建数组的简单方法

    1.数组的声明方法 (1): arrayObj = new Array(); //创建一个数组. 代码如下: var arr1 = new Array(); (2):arrayObj = new Array([size]) 创建一个数组并指定长度,注意不是上限,是长度. 代码如下: var a = new Array(5); (3):arrayObj = new Array([element0[, element1[, ...[, elementN]]]]) 创建一个数组并赋值. 代码如下: v

  • javascript创建数组的最简代码

    日一二三四五六'.split('')  ['日','一','二','三','四','五','六']  Array('日','一','二','三','四','五','六')  new Array('日','一','二','三','四','五','六')  这里是输入的代码内容 w=document.writeln w("'日一二三四五六'.split('')") w('日一二三四五六'.split('')) w(['日','一','二','三','四','五','六']) w(Array

  • js创建一个input数组并绑定click事件的方法

    复制代码 代码如下: </pre><pre name="code" class="javascript"><html> <body> <input type="button" name="input[]" value="按钮1" /><br /> <input type="button" name="

  • javascript数组操作(创建、元素删除、数组的拷贝)

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

  • JavaScript 批量创建数组的方法

    JavaScript有许多批量创建数组的方法,为了衡量它们的性能,我分别使用不同的方法创建一个长度为100000的数组,且键和值相等.同时,我定义了下面这个函数用来测量创建数组所耗费的时间: function t(fn) { var start = Date.now(); fn.call(this); var end = Date.now(); return (end - start) + 'ms'; } 以下为常用的几个创建数组的方法以及它们所耗费的时间: 使用join和split 该方法把大

  • 把json格式的字符串转换成javascript对象或数组的方法总结

    第一种 JSON.parse(jsonString) 第二种 eval("("+jsonString+")") 第三种 var obj=(function ToJSON(o){ if(typeof(o)=="string")try{return new Function("return "+o)();}catch(e){return null;} })("[{name:'zhangsan',age:'24'},{na

  • javascript动态创建链接的方法

    本文实例讲述了javascript动态创建链接的方法.分享给大家供大家参考.具体分析如下: 动态创建链接示例: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>动态添加链接</title&

  • Javascript动态创建div的方法

    本文实例讲述了Javascript动态创建div的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xht

  • 详解JavaScript中的数组合并方法和对象合并方法

    1 数组合并 1.1 concat 方法 var a=[1,2,3],b=[4,5,6]; var c=a.concat(b); console.log(c);// 1,2,3,4,5,6 console.log(a);// 1,2,3 不改变本身 1.2 循环遍历 var arr1=['a','b']; var arr2=['c','d','e']; for(var i=0;i<arr2.length;i++){ arr1.push(arr2[i]) } console.log(arr1);/

  • JavaScript创建数组的方法详解

    目录 JavaScript创建数组 数组的使用 将数组转换为分割字符串 数组中新增元素 筛选数组 删除数组指定元素 总结 JavaScript创建数组 1.利用new创建数组 var arr = new Array();//创建了一个空数组 2.利用数组字面量创建数组(比较常用) 字面量:一种固定值的表示方法 一看就知道什么数据类型,比如8一看就是数字类型 //1.利用数组字面量(是方括号)创建数组 var arr = [];//创建了一个空数组 var arr1 = [1,2,'student

  • Javascript remove 自定义数组删除方法

    复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Javascript自定义数组删除方法remove()</title> <script type="text/javascript"> Array.prototype.remove=function(dx){ if(isNaN(dx)||dx>this.lengt

  • ES6 新增的创建数组的方法(小结)

    在ES6之前,创建数组的方式有2种: 一: 通过数组字面量 let array = [1,2,3]; console.log(array);//[1,2,3] 二: 通过new Array()创建数组 let array = new Array(1, 2, 3); console.log(array); //[1,2,3] 在大多数情况下new Array()运行良好: let array = new Array(1, 2); console.log(array.length); //2 con

  • JavaScript中清空数组的方法总结

     方式1,splice var ary = [1,2,3,4]; ary.splice(0,ary.length); console.log(ary); // 输出 [],空数组,即被清空了 方式2,length赋值为0 这种方式很有意思,其它语言如Java,其数组的length是只读的,不能被赋值.如 int[] ary = {1,2,3,4}; ary.length = 0; Java中会报错,编译通不过.而JS中则可以,且将数组清空了, var ary = [1,2,3,4]; ary.l

  • shell脚本批量创建用户的方法小结

    目录 shell脚本批量创建用户基本操作 附:用shell脚本批量创建50个用户并设置密码,批量删除用户 总结 shell脚本批量创建用户基本操作 案例:批量创建user01 ~ user20 一共二十个文件,密码为随机的六位数  并且将 用户名和密码 输出到 user.txt 文件中 #!/bin/bash #批量创建20个用户 user01 ~ user20 user=user #创建存储用户和密码的文件 touch user.txt txt=user.txt #循环遍历1到20 for i

随机推荐