JavaScript中的console.time()函数详细介绍


Posted in Javascript onDecember 29, 2014

如果需要在Web调试过程中知道代码执行的时间,那么可以通过在JavaScript代码中添加console.time()语句和console.timeEnd()语句来对程序的执行进行计时。以下面这个耗时较长的foo()函数为例:

function foo(){

    var x = 4.237;

    var y = 0;

    for (var i=0; i<100000000; i++) {

        y = y + x*x;

    }

    return y;

}

如果需要知道函数执行过程中消耗了多长时间,可以在foo()函数调用之前插入console.time()语句,在其调用结束后插入console.timeEnd()语句:

console.time("test");

foo();

console.timeEnd("test");

程序执行完毕后,控制台会显示此次计时的结果:”test: 1797ms”,显示的日志级别为info。

console.time()和console.timeEnd()接受一个字符串作为参数,该字符串相当于计时的id。浏览器会将拥有相同参数(id)的console.time()与console.timeEnd()进行配对,记录两者之间的时间差。因此,可以通过使用不同的id来对JavaScript程序中不同的地方进行计时。

浏览器支持

对于各个浏览器,console.time()计时的支持情况如下:

Firefox。10.0后原生支持。对于之前版本的Firefox,可以通过安装Firebug插件来实现。详见:https://developer.mozilla.org/en-US/docs/Web/API/console.time?redirectlocale=en-US&redirectslug=DOM%2Fconsole.time
Google Chrome。2.0后原生支持。详见:https://developers.google.com/chrome-developer-tools/docs/console-api#consoletimelabel
IE。IE11中原生支持。对于之前版本的IE,可以通过安装Firebug Lite来实现。详见:http://msdn.microsoft.com/en-us/library/ie/dn265071%28v=vs.85%29.aspx
Safari。4.0后原生支持。详见:https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Console/Console.html
Opera。支持。详见:http://www.opera.com/dragonfly/documentation/console/

Javascript 相关文章推荐
鼠标移动到一张图片时变为另一张图片
Dec 05 Javascript
jQuery 入门级学习笔记及源码
Jan 22 Javascript
基于jquery tab切换(防止页面刷新)
May 23 Javascript
javascript trim函数在IE下不能用的解决方法
Sep 12 Javascript
Jquery 实现弹出层插件
Jan 28 Javascript
IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题
Aug 21 Javascript
JS实现仿腾讯微博无刷新删除微博效果代码
Oct 16 Javascript
浅谈javascript中的Function和Arguments
Aug 30 Javascript
js实现键盘自动打字效果
Dec 23 Javascript
ES6新特性八:async函数用法实例详解
Apr 21 Javascript
JS实现动态添加外部js、css到head标签的方法
Jun 05 Javascript
js实现动态时钟
Mar 12 Javascript
JavaScript前端图片加载管理器imagepool使用详解
Dec 29 #Javascript
JavaScript版的TwoQueues缓存模型
Dec 29 #Javascript
浅谈重写window对象的方法
Dec 29 #Javascript
JavaScript中的console.log()函数详细介绍
Dec 29 #Javascript
深入分析原生JavaScript事件
Dec 29 #Javascript
JavaScript中的alert()函数使用技巧详解
Dec 29 #Javascript
JavaScript实现三阶幻方算法谜题解答
Dec 29 #Javascript
You might like
PHP按行读取文件时删除换行符的3种方法
2014/05/04 PHP
PHP使用递归生成文章树
2015/04/21 PHP
删除PHP数组中头部、尾部、任意元素的实现代码
2017/04/10 PHP
PHP实现的观察者模式实例
2017/06/21 PHP
JS处理VBArray的函数使用说明
2008/05/11 Javascript
jquery事件机制扩展插件 jquery鼠标右键事件。
2011/12/26 Javascript
jQuery中:header选择器用法实例
2014/12/29 Javascript
jQuery实现瀑布流的取巧做法分享
2015/01/12 Javascript
jquery层级选择器(匹配父元素下的子元素实现代码)
2016/09/05 Javascript
JS封装的选项卡TAB切换效果示例
2016/09/20 Javascript
AngularJS之页面跳转Route实例代码
2017/03/10 Javascript
Vue.js实现模拟微信朋友圈开发demo
2017/04/20 Javascript
浅谈Vue 初始化性能优化
2017/08/31 Javascript
React如何避免重渲染
2018/04/10 Javascript
webpack手动配置React开发环境的步骤
2018/07/02 Javascript
vue+express 构建后台管理系统的示例代码
2018/07/19 Javascript
vue.js提交按钮时进行简单的if判断表达式详解
2018/08/08 Javascript
js限制输入框只能输入数字(onkeyup触发)
2018/09/28 Javascript
解决ng-repeat产生的ng-model中取不到值的问题
2018/10/02 Javascript
详解Vue底部导航栏组件
2019/05/02 Javascript
js canvas实现星空连线背景特效
2019/11/01 Javascript
JavaScript canvas基于数组生成柱状图代码实例
2020/03/06 Javascript
JS对象属性的检测与获取操作实例分析
2020/03/17 Javascript
[48:46]完美世界DOTA2联赛PWL S2 SZ vs FTD.C 第二场 11.19
2020/11/19 DOTA
python构造icmp echo请求和实现网络探测器功能代码分享
2014/01/10 Python
Python获取任意xml节点值的方法
2015/05/05 Python
python 定义给定初值或长度的list方法
2018/06/23 Python
python检测IP地址变化并触发事件
2018/12/26 Python
Python设计模式之职责链模式原理与用法实例分析
2019/01/11 Python
Python class的继承方法代码实例
2020/02/14 Python
Python中的None与 NULL(即空字符)的区别详解
2020/09/24 Python
Python:__eq__和__str__函数的使用示例
2020/09/26 Python
Python numpy大矩阵运算内存不足如何解决
2020/11/19 Python
美国隐形眼镜网上商店:Lens.com
2019/09/03 全球购物
2014年3.15团委活动总结
2014/03/16 职场文书
某集团股份有限公司委托书样本
2014/09/24 职场文书