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 相关文章推荐
JSON 学习之JSON in JavaScript详细使用说明
Feb 23 Javascript
学习面向对象之面向对象的基本概念:对象和其他基本要素
Nov 30 Javascript
用jQuery获取IE9下拉框默认值问题探讨
Jul 22 Javascript
Js放到HTML文件中的哪个位置有什么区别
Aug 21 Javascript
jquery 获取 outerHtml 包含当前节点本身的代码
Oct 30 Javascript
JS弹出对话框实现方法(三种方式)
Dec 18 Javascript
深入理解react-router@4.0 使用和源码解析
May 23 Javascript
解决js ajax同步请求造成浏览器假死的问题
Jan 18 Javascript
Vue2.0 实现单选互斥的方法
Apr 13 Javascript
微信小程序里引入SVG矢量图标的方法
Sep 20 Javascript
JS实现图片懒加载(lazyload)过程详解
Apr 02 Javascript
js实现带有动画的返回顶部
Aug 09 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实现定时生成HTML网站首页实例代码
2008/11/20 PHP
thinkphp实现like模糊查询实例
2014/10/29 PHP
PHP代码维护,重构变困难的4种原因分析
2016/01/25 PHP
图文详解PHP环境搭建教程
2016/07/16 PHP
javascript之对系统的toFixed()方法的修正
2007/05/08 Javascript
JavaScript DOM 学习第七章 表单的扩展
2010/02/19 Javascript
javascript中的new使用
2010/03/20 Javascript
JQuery从头学起第一讲
2010/07/04 Javascript
基于jQuery的动态表格插件
2011/03/28 Javascript
Javascript图像处理—平滑处理实现原理
2012/12/28 Javascript
js判断iframe内的网页是否滚动到底部触发事件
2014/03/18 Javascript
java、javascript实现附件下载示例
2014/08/14 Javascript
项目实践一图片上传之form表单还是base64前端图片压缩(前端图片压缩)
2016/07/28 Javascript
基于js实现二级下拉联动
2016/12/17 Javascript
Bootstrap入门教程一Hello Bootstrap初识
2017/03/02 Javascript
详解JS构造函数中this和return
2017/09/16 Javascript
node文字生成图片的示例代码
2017/10/26 Javascript
Vue.js获取被选择的option的value和text值方法
2018/08/24 Javascript
jQuery+PHP实现上传裁剪图片
2020/06/29 jQuery
Javascript作用域和作用域链原理解析
2020/03/03 Javascript
遗传算法之Python实现代码
2017/10/10 Python
Python 模拟员工信息数据库操作的实例
2017/10/23 Python
python爬虫之BeautifulSoup 使用select方法详解
2017/10/23 Python
详解python函数传参是传值还是传引用
2018/01/16 Python
python 读取视频,处理后,实时计算帧数fps的方法
2018/07/10 Python
Tensorflow实现酸奶销量预测分析
2019/07/19 Python
Python字典推导式将cookie字符串转化为字典解析
2019/08/10 Python
Python队列、进程间通信、线程案例
2019/10/25 Python
python实现高斯判别分析算法的例子
2019/12/09 Python
HTML5触摸事件演化tap事件介绍
2016/03/25 HTML / CSS
乌克兰移动电子产品和相关配件的在线商店:iTMag
2020/03/16 全球购物
护士找工作求职信
2014/07/02 职场文书
校园元旦活动总结
2014/07/09 职场文书
Python基础之字符串格式化详解
2021/04/21 Python
JavaScript实现队列结构过程
2021/12/06 Javascript
Pandas数据结构之Series的使用
2022/03/31 Python