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 相关文章推荐
非常不错的一个javascript 类
Nov 07 Javascript
用JAVASCRIPT如何给&amp;lt;textarea&amp;gt;&amp;lt;/textarea&amp;gt;赋值
Apr 20 Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
Nov 21 Javascript
jquery触发a标签跳转事件示例代码
Jul 21 Javascript
详解JavaScript基于面向对象之继承实例
Dec 16 Javascript
深入理解jQuery之防止冒泡事件
May 24 Javascript
js利用appendChild对标签进行排序的实现方法
Oct 16 Javascript
使用jsonp实现跨域获取数据实例讲解
Dec 25 Javascript
angular过滤器实现排序功能
Jun 27 Javascript
Angular2关于@angular/cli默认端口号配置的问题
Jul 15 Javascript
webpack本地开发环境无法用IP访问的解决方法
Mar 20 Javascript
vue-cli4.0多环境配置变量与模式详解
Dec 30 Vue.js
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
提问的智慧
2006/10/09 PHP
PHP 计算代码执行耗时的代码修正网上普遍错误
2011/05/14 PHP
php微信开发之带参数二维码的使用
2016/08/03 PHP
php 自定义错误日志实例详解
2016/11/12 PHP
IE中直接运行显示当前网页中的图片 推荐
2006/08/31 Javascript
javascript中检测变量的类型的代码
2010/12/28 Javascript
对象无length属性时IE6/IE7中无法将其转换成伪数组(ArrayLike)
2011/07/31 Javascript
两种常用的javascript数组去重方法思路及代码
2013/03/26 Javascript
Jquery模仿Baidu、Google搜索时自动补充搜索结果提示
2013/12/26 Javascript
jQuery - css() 方法示例详解
2014/01/16 Javascript
jquery实现保存已选用户
2014/07/21 Javascript
Json实现异步请求提交评论无需跳转其他页面
2014/10/11 Javascript
浅析创建javascript对象的方法
2016/05/13 Javascript
关于验证码在IE中不刷新的快速解决方法
2016/09/23 Javascript
jQuery除指定区域外点击任何地方隐藏DIV功能
2017/11/13 jQuery
基于vue2.0实现简单轮播图
2017/11/27 Javascript
12条写出高质量JS代码的方法
2018/01/07 Javascript
js中调用微信的扫描二维码功能的实现代码
2020/04/11 Javascript
JavaScript Date对象功能与用法学习记录
2020/04/28 Javascript
详解Python3中yield生成器的用法
2015/08/20 Python
windows系统下Python环境搭建教程
2017/03/28 Python
python 3.6 +pyMysql 操作mysql数据库(实例讲解)
2017/12/20 Python
使用PyQt4 设置TextEdit背景的方法
2019/06/14 Python
Django Channels 实现点对点实时聊天和消息推送功能
2019/07/17 Python
python实现视频读取和转化图片
2019/12/10 Python
Pytorch释放显存占用方式
2020/01/13 Python
Python类中self参数用法详解
2020/02/13 Python
自定义Django_rest_framework_jwt登陆错误返回的解决
2020/10/18 Python
HTML5 背景的显示区域实现
2020/07/09 HTML / CSS
Java语言程序设计测试题改错题部分
2014/07/22 面试题
小班幼儿评语大全
2014/04/30 职场文书
优秀党支部书记事迹材料
2014/05/29 职场文书
淘宝活动总结范文
2014/06/26 职场文书
干货!开幕词的写作方法
2019/04/02 职场文书
MySQL 全文索引使用指南
2021/05/25 MySQL
Python合并pdf文件的工具
2021/07/01 Python