Js利用console计算代码运行时间的方法示例


Posted in Javascript onSeptember 24, 2017

前言

本文主要给大家介绍了关于Js用console计算代码运行时间的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

需求

如果学习前端一定时间以后,就会考虑性能方面的问题。那么问题来了,我们怎么计算出一段代码的运行时间呢?

使用console.log配合Date对象计算

比如,我们计算sort方法排序十万个随机数组成的数组需要用多长时间的话,可以这么写:

var arr = [];
    for(var i=0; i<100000; i++){
      arr.push(Math.random());
    }
    var beginTime = +new Date();
    arr.sort();
    var endTime = +new Date();
    console.log("排序用时共计"+(endTime-beginTime)+"ms");

最后在控制台会显示:

排序用时共计552ms

下面,再介绍一种更灵活更准确的方法。

使用console.time进行时间计算

这种方法比上一种更准确,而且专门为性能产生的方法:
测试案例:

var arr = [];
    for(var i=0; i<100000; i++){
      arr.push(Math.random());
    }
    console.time("sort");
    arr.sort();
    console.timeEnd("sort");

控制台会打印出:

sort: 542.668701171875ms

这种方法在需要测试的开始位置写上console.time,并且括号内传一个字符串。在结束的位置使用console.timeEnd方法,并再次把字符串传入。

个人推荐第二种方式。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
手机平板等移动端适配跳转URL的js代码
Jan 25 Javascript
js限制文本框只能输入数字方法小结
Jun 16 Javascript
JavaScript中数组的各种操作的总结(必看篇)
Feb 13 Javascript
DOM事件探秘篇
Feb 15 Javascript
微信小程序中input标签详解及简单实例
May 18 Javascript
JavaScript实现简单动态进度条效果
Apr 06 Javascript
在vue2.0中引用element-ui组件库的方法
Jun 21 Javascript
weui中的picker使用js进行动态绑定数据问题
Nov 06 Javascript
vue 实现tab切换保持数据状态
Jul 21 Javascript
Vue+Element ui 根据后台返回数据设置动态表头操作
Sep 21 Javascript
vue render函数动态加载img的src路径操作
Oct 26 Javascript
使用refresh_token实现无感刷新页面
Apr 26 Javascript
详解Web使用webpack构建前端项目
Sep 23 #Javascript
vue webuploader 文件上传组件开发
Sep 23 #Javascript
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 #jQuery
一个有意思的鼠标点击文字特效jquery代码
Sep 23 #jQuery
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
Sep 23 #jQuery
VsCode新建VueJs项目的详细步骤
Sep 23 #Javascript
详解webpack + vue + node 打造单页面(入门篇)
Sep 23 #Javascript
You might like
PHP下判断网址是否有效的代码
2011/10/08 PHP
ThinkPHP V2.2说明文档没有说明的那些事实例小结
2015/07/01 PHP
php实现多维数组排序的方法示例
2017/03/23 PHP
PHP编程快速实现数组去重的方法详解
2017/07/22 PHP
PHP中将一个字符串部分字符用星号*替代隐藏的实现代码
2019/09/08 PHP
php实例化一个类的具体方法
2019/09/19 PHP
用window.location.href实现刷新另个框架页面
2007/03/07 Javascript
JavaScript脚本性能优化注意事项
2008/11/18 Javascript
同一个表单 根据要求递交到不同页面的实现方法小结
2009/08/05 Javascript
JavaScript 组件之旅(一)分析和设计
2009/10/28 Javascript
JavaScript判断DOM何时加载完毕的技巧
2012/11/11 Javascript
input链接页面、打开新网页等等的具体实现
2013/12/30 Javascript
javascipt:filter过滤介绍及使用
2014/09/10 Javascript
node.js中的fs.utimesSync方法使用说明
2014/12/15 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
2017/02/16 Javascript
Bootstrap页面标题Page Header的实现方法
2017/03/22 Javascript
nodejs个人博客开发第四步 数据模型
2017/04/12 NodeJs
使用Bootstrap和Vue实现用户信息的编辑删除功能
2017/10/25 Javascript
JS原生瀑布流效果实现
2019/04/26 Javascript
谈一谈vue请求数据放在created好还是mounted里好
2020/07/27 Javascript
AngularJs的$http发送POST请求,php无法接收Post的数据问题及解决方案
2020/08/13 Javascript
JavaScript实现网页tab栏效果制作
2020/11/20 Javascript
[57:28]2018DOTA2亚洲邀请赛 4.6 淘汰赛 TNC vs Liquid 第一场
2018/04/10 DOTA
python实现的简单猜数字游戏
2015/04/04 Python
Sanic框架安装与简单入门示例
2018/07/16 Python
python实现将多个文件分配到多个文件夹的方法
2019/01/07 Python
Python3解释器知识点总结
2019/02/19 Python
Python编程快速上手——正则表达式查找功能案例分析
2020/02/28 Python
使用 css3 transform 属性来变换背景图的方法
2019/05/07 HTML / CSS
德国大型箱包和皮具商店:Koffer
2019/10/01 全球购物
自我评价怎么写正确呢?
2013/12/02 职场文书
青年志愿者活动方案
2014/08/17 职场文书
歌颂党的演讲稿
2014/09/10 职场文书
详解Python小数据池和代码块缓存机制
2021/04/07 Python
MySql子查询IN的执行和优化的实现
2021/08/02 MySQL
使用Nginx+Tomcat实现负载均衡的全过程
2022/05/30 Servers