JS简单测试循环运行时间的方法


Posted in Javascript onSeptember 04, 2016

本文实例讲述了JS简单测试循环运行时间的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>JS 测试循环运行的时间</title>
<script>
  var arr = [];
  var max = 10000000;
  //加载
  window.addEventListener("load", function () {
    setTimeout(function () {
      //初始化arr
      for (var i = 0; i < max; i++) {
        arr[i] = i + 1;
      }
      //显示所有按钮
      document.getElementById("div1").style.display = "block";
      document.getElementById("div2").style.display = "none";
    }, 1);
  });
  //1) 使用 for 循环
  function test1() {
    var d1 = new Date();
    var sum = 0;
    for (var i = 0; i < arr.length; i++) {
      sum += arr[i]
    }
    var d2 = new Date();
    var x = d2 - d1;
    console.log("for计算结果:" + sum + ",用时:" + x);
  }
  //2) 使用 for..in 循环
  function test2() {
    var d1 = new Date();
    var sum = 0;
    for (var i in arr) {
      sum += arr[i]
    }
    var d2 = new Date();
    var x = d2 - d1;
    console.log("for..in计算结果:" + sum + ",用时:" + x);
  }
  //3) 使用 forEach 循环
  function test3() {
    var d1 = new Date();
    var sum = 0;
    arr.forEach(function (n) {
      sum += n;
    })
    var d2 = new Date();
    var x = d2 - d1;
    console.log("forEach计算结果:" + sum + ",用时:" + x);
  }
</script>
</head>
<body>
请按F12查看控制器输出 <br />
<div id="div1" style="display:none;">
  <input type="button" value="使用for循环" onclick="test1();" /> <br />
  <input type="button" value="使用for..in循环" onclick="test2();" /> <br />
  <input type="button" value="使用forEach循环" onclick="test3();" /> <br />
</div>
<div id="div2">
  正在初始化...
</div>
</body>
</html>

效果图:

JS简单测试循环运行时间的方法

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
[JS源码]超长文章自动分页(客户端版)
Jan 09 Javascript
defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
Apr 27 Javascript
jQuery 源码分析笔记(5) jQuery.support
Jun 19 Javascript
利用javascript数组长度循环数组内所有元素
Dec 27 Javascript
在Node.js中使用HTTP上传文件的方法
Jun 23 Javascript
js实现左侧网页tab滑动门效果代码
Sep 06 Javascript
JavaScript小技巧整理
Dec 30 Javascript
BootStrap TreeView使用实例详解
Nov 01 Javascript
详细分析jsonp的原理和实现方式
Nov 20 Javascript
vue-star评星组件开发实例
Mar 01 Javascript
javascript sort()对数组中的元素进行排序详解
Oct 13 Javascript
Vue使用screenfull实现全屏效果
Sep 17 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
Sep 04 #Javascript
利用原生js和jQuery实现单选框的勾选和取消操作的方法
Sep 04 #Javascript
关于两个jQuery(js)特效冲突的bug的解决办法
Sep 04 #Javascript
DOM操作原生js 的bug,使用jQuery 可以消除的解决方法
Sep 04 #Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
Sep 03 #Javascript
JavaScript 冒泡排序和选择排序的实现代码
Sep 03 #Javascript
浅析$(function) ready和onload 的区别
Sep 03 #Javascript
You might like
模仿OSO的论坛(五)
2006/10/09 PHP
几款免费开源的不用数据库的php的cms
2010/12/19 PHP
PHP反转字符串函数strrev()函数的用法
2012/02/04 PHP
PHP7正式版测试,性能惊艳!
2015/12/08 PHP
PHP策略模式定义与用法示例
2017/07/27 PHP
PHP7基于curl实现的上传图片功能
2018/05/11 PHP
php 将json格式数据转换成数组的方法
2018/08/21 PHP
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
关于锚点跳转及jQuery下相关操作与插件
2012/10/01 Javascript
IE 下Enter提交表单存在重复提交问题的解决方法
2014/05/04 Javascript
扒一扒JavaScript 预解释
2015/01/28 Javascript
jQuery随机密码生成的方法
2015/03/09 Javascript
js实现向右横向滑出的二级菜单效果
2015/08/27 Javascript
解析Node.js基于模块和包的代码部署方式
2016/02/16 Javascript
详解Angular.js中$http拦截器的介绍及使用
2017/07/04 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
2017/07/27 Javascript
Angular实现的日程表功能【可添加及隐藏显示内容】
2017/12/27 Javascript
在vue项目中使用Jquery-contextmenu插件的步骤讲解
2019/01/27 jQuery
node.js通过url读取文件
2020/10/16 Javascript
[02:57]2014DOTA2国际邀请赛-观众采访
2014/07/19 DOTA
天翼开放平台免费短信验证码接口使用实例
2013/12/18 Python
Python中使用语句导入模块或包的机制研究
2015/03/30 Python
利用Python批量压缩png方法实例(支持过滤个别文件与文件夹)
2017/07/30 Python
python3中sorted函数里cmp参数改变详解
2020/03/12 Python
对python中list的五种查找方法说明
2020/07/13 Python
CSS伪类与CSS伪元素的区别及由来具体说明
2012/12/07 HTML / CSS
自荐信结尾
2013/10/27 职场文书
税务专业毕业生自荐信
2013/11/10 职场文书
工商企业管理专业自荐信范文
2014/04/12 职场文书
企业安全生产标语
2014/06/06 职场文书
医院保洁服务方案
2014/06/11 职场文书
做人民满意的公务员活动方案
2014/08/25 职场文书
工厂门卫岗位职责
2015/04/13 职场文书
酒店前台岗位职责
2015/04/16 职场文书
2019通用版导游词范本!
2019/08/07 职场文书
Golang连接并操作MySQL
2022/04/14 MySQL