• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > JavaScript 批量创建数组的方法

JavaScript 批量创建数组的方法

作者:tonyinsh 字体:[增加 减小] 来源:互联网 时间:2017-05-11

tonyinsh通过本文主要向大家介绍了javascript数组方法,javascript中创建数组,javascript创建数组,javascript 二维数组,javascript 数组等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

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

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

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

使用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 批量创建数组的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • javascript过滤数组重复元素的实现方法
  • javascript数组去重常用方法实例分析
  • JavaScript 批量创建数组的方法
  • JavaScript中三种常见的排序方法
  • 谈谈JavaScript数组常用方法总结
  • JavaScript数组去重的6个方法
  • Javascript 两种刷新方法以及区别和适用范围
  • javascript添加前置0(补零)的几种方法

相关文章

  • 2017-05-11vuejs父子组件通信的问题
  • 2017-05-11常用的js方法合集
  • 2017-05-11Vue数据驱动模拟实现1
  • 2017-05-11jquery仿微信聊天界面
  • 2017-05-11node.js爬虫爬取拉勾网职位信息
  • 2017-05-11原生JS实现图片翻书效果
  • 2017-05-11JS排序之选择排序详解
  • 2017-05-11老生常谈javascript中逻辑运算符&&和||的返回值问题
  • 2017-05-11JavaScript下拉菜单功能实例代码
  • 2017-05-11JavaScript中数组的各种操作的总结(必看篇)

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • Bootstrap警告框(Alert)插件使用方法
    • 微信小程序 label 组件详解及简单实例
    • 正则验证小数点后面只能有两位数的方法
    • js转换对象为xml
    • 原生js实现手风琴功能(支持横纵向调用)
    • React组件的三种写法总结
    • 关于call和apply函数
    • EsLint入门学习教程
    • javascript深拷贝的原理与实现方法分析
    • 函数四种调用模式以及其中的this指向

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有