1.数组循环遍历方法

javascript传统的数组遍历有for循环,while循环,以及for-in。
本篇文章要比较的是以下几种循环遍历方法:

遍历方式 备注
正向for循环  
逆向for循环 减少一次控制条件比较,性能理论上比正向for循环稍好
while循环  
for-in循环 理论性能最差
for-each循环  
duff's device 循环 利用并发,理论性能最好wiki 介绍

2.代码:

var number = 100000;//array大小
var iteranum = 100;//迭代次数
var array = [];
for(let i=0;i<number;i++)
{
array[i] = i+1;
} //test cicle
var len = array.length;
//正常for循环
console.time('normal for');
for(let k=0;k<iteranum;k++)
{
for(let i=0;i<len;i++)
{
array[i]+1;
}
} console.timeEnd('normal for'); //倒序for循环
console.time('reverse for');
for(let k=0;k<iteranum;k++)
{
for(let i=len-1;i--;)
{
array[i]+1;
}
}
console.timeEnd('reverse for'); //while循环
console.time('while');
for(let k=0;k<iteranum;k++)
{
let i=0;
while(i<len)
{
array[i]+1;
i++;
}
}
console.timeEnd('while'); //for-in循环
console.time('for-in');
for(let k=0;k<iteranum;k++)
{
for(let i in array)
{
array[i]+1;
}
}
console.timeEnd('for-in'); //for each 循环
console.time("for each");
for(let k=0;k<iteranum;k++)
{
array.forEach(function(e){
e+1;
});
}
console.timeEnd("for each"); //duff's device 循环
console.time("device's device");
for(let k=0;k<iteranum;k++)
{
let j = len % 8;
let templen = len-1;
while(j){
j--;
array[templen--]+1;
} j = Math.floor(len / 8); while(j){
j--;
array[templen--]+1;
array[templen--]+1;
array[templen--]+1;
array[templen--]+1;
array[templen--]+1;
array[templen--]+1;
array[templen--]+1;
array[templen--]+1;
}
}
console.timeEnd("device's device");

3.实验步骤

  • 实验环境 ,操作系统 windows server 2016, node 8.0,cpu E5-1630 v3 @ 3.7GHz ,内存16G
  • 数组内的数据操作很简单,就是将每一个元素加1,但是不覆盖原先的数据
  • 实验将采取多点采样,数组样本大小分别设置为:1000,10000,100000,1000000(1000次以下性能差距不大)
  • 对每种方式分别进行100次仿真叠加,最后取100次的仿真结果平均数,作为该实验数据的最终结果。
  • 将结果以折线图的形式展示

4.实验结果

(1)结果表格(单位:微秒)

遍历方式/Item数量 1000 10000 100000 1000000
正向for循环 43 456 3840 35679
逆向for循环 37 378 3604 33488
while循环 66 296 2294 20576
for-in循环 87 958 32443 401017
for-each循环 64 395 4272 32435
duff's device 循环 20 235 2137 16364

(2)结果直方图

为了结果展示方便,将所有数据都进行了log转换

几种数组循环的性能对比

横向为数组元素大小,纵向为运行时间(微秒)的log值。
上图可见,duff's device方式执行效率一直很高,而for-in方式的效率一直很低,正向for和逆向for效率相差不大,逆向for稍微占优势。

5.总结

    • 总体来说for循环和for-each性能相当,在小数据量时也与while性能相当。for-in性能最差,duff's device性能最好。大数据量时,while性能优于for循环和for-each循环。
    • 对于数据量不大的循环(<1000),不用考虑使用哪一种性能更好,可读性是第一位
    • 对于有较大数据量的循环和遍历,如果性能不是瓶颈,那么普通的for循环(或者while,do-while,for-each)就可以了,毕竟可读性强。
    • 对于较大的数据量,如果array的循环操作已经成为瓶颈,或者性能非常重要,那么可以采用duff's device方案。
    • 任何时候都不建议使用for-in,除非必须要用

javascript循环性能比较的更多相关文章

  1. JavaScript 循环性能比较

    有一句话叫做 没有什么事是一个循环解决不了的,如果真有,那就再来一个循环. 循环的种类有很多 正向for循环,逆向for循环,while循环,for-in循环(理论上性能最差),for-each循环, ...

  2. Javascript注意事项四【提高循环性能的策略】

    for(var i = item.length;i--){ process(item[i]); } 1.通过倒叙循环 2.最小化属性查询 3.尽量不要使用函数迭代(forEach)

  3. JavaScript性能优化

    如今主流浏览器都在比拼JavaScript引擎的执行速度,但最终都会达到一个理论极限,即无限接近编译后程序执行速度. 这种情况下决定程序速度的另一个重要因素就是代码本身. 在这里我们会分门别类的介绍J ...

  4. 高性能JavaScript 循环语句和流程控制

    前言 上一篇探讨了达夫设备对于代码性能的影响,本文主要探讨并且测试各种常见的循环语句的性能以及流程控制中常见的优化. 循环语句 众所周知,常用的循环语句有for.while.do-while以及for ...

  5. 高性能JavaScript笔记二(算法和流程控制、快速响应用户界面、Ajax)

    循环 在javaScript中的四种循环中(for.for-in.while.do-while),只有for-in循环比其它几种明显要慢,另外三种速度区别不大 有一点需要注意的是,javascript ...

  6. Javascript与当前项目的思考

      主体 分为以下三部分,能力.经验有限,欢迎拍砖. 1.低效的代码 2.面向对象的重构重复利用代码 3.调试的经验总结 第一部分 日常中低效的代码 加载和运行 <html> <he ...

  7. 【读书笔记】读《高性能JavaScript》

    这本<高性能JavaScript>讲述了有关JavaScript性能优化的方方面面,主要围绕以下几个方面: 1> 加载顺序 2> 数据访问(如怎样的数据类型访问最快,怎样的作用 ...

  8. 《高性能Javascript》读书笔记-4

    第四章 算法和流程控制 代码组织结构和解决具体问题的思路是影响代码性能的主要因素 循环处理是最常见的编程模式之一,也是提高性能的关注点之一 循环分四种:标准for循环 ; i < Things. ...

  9. 《高性能javascript》学习总结

    本文是学习<高性能javascript>(Nichols C. Zakes著)的一些总结,虽然书比较过时,里面的知识点也有很多用不上了,但是毕竟是前人一步步探索过来的,记录着javascr ...

随机推荐

  1. python3之模板pycurl探测web服务质量

    1.pycurl简介 pycURL是libcurl多协议文件传输库的python接口,与urllib模块类似,PycURL可用于从python程序中获取由URL标识的对象,功能很强大,libcurl速 ...

  2. C# 各版本新特性

    C# 2.0 泛型(Generics) 泛型是CLR 2.0中引入的最重要的新特性,使得可以在类.方法中对使用的类型进行参数化. 例如,这里定义了一个泛型类: class MyCollection&l ...

  3. JQ实现弹幕效果

    JQ实现弹幕效果,快来吐糟你的想法吧 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <meta charse ...

  4. HttpUrlConnection的setDoOutput与setDoInput的区别

    httpUrlConnection.setDoOutput(true) httpUrlConnection.setDoInput(true) 这两个方法在develope的httpUrlConnect ...

  5. .NetCore Cap 结合 RabbitMQ 实现消息订阅

    开源分布式消息框架 Cap 可以在GitHub上拉也可以通过nuget添加 上一篇博文写了 Windows RabbitMQ的安装使用 Cap支持事务,通过捕获数据库上下文连接对象实现 消息事务,消息 ...

  6. ADO.Net1

    一.ADO.Net 数据库连接技术 二.查询 1.步骤: 1)使用数据库空间:using System.Data.SqlClient; 2)连接数据库 3)创建数据库操作命令 4)输入操作命令 5)开 ...

  7. 【LOJ】#2071. 「JSOI2016」最佳团体

    题解 01分数规划,二分加树背包-- 代码 #include <bits/stdc++.h> #define enter putchar('\n') #define space putch ...

  8. MongoDB 安全配置

    前言 随着MongoDB使用人群企业越来越广泛,黑客的注意力也转移到了其中.比如去年很火热的MongoDB劫持事件,很多人对MongoDB的安全也越来越重视.今天,我们就简单总结一些MongoDB的安 ...

  9. 【Java】 大话数据结构(5) 线性表之双向链表

    本文根据<大话数据结构>一书,实现了Java版的双向链表. 在每个数据结点中都有两个指针,分别指向直接后继和直接前驱,这样的链表称为双向链表. 双向链表的结构如图所示: 查找元素可以根据元 ...

  10. 医学图像之DICOM格式解析

    最近导师给安排了新任务,由于刚进入实验室,对于医学图像这一块还一知半解,所以就想分享一下有关医学常见影像的学习(尤其是dicom后缀的图像文件),欢迎大家一起交流. 目录 1.医学影像学的介绍 2.D ...