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 相关文章推荐
showModelessDialog()使用详解
Sep 21 Javascript
纯JAVASCRIPT图表动画插件Highcharts Examples
Apr 16 Javascript
鼠标放在图片上显示大图的JS代码
Mar 26 Javascript
JavaScript中把数字转换为字符串的程序代码
Jun 19 Javascript
如何从jQuery的ajax请求中删除X-Requested-With
Dec 11 Javascript
node.js中的console.timeEnd方法使用说明
Dec 09 Javascript
微信小程序 选项卡的简单实例
May 24 Javascript
为输入框加入数字js校验代码分享
Nov 02 Javascript
通过JQuery,JQueryUI和Jsplumb实现拖拽模块
Jun 18 jQuery
微信小程序实现蓝牙打印
Sep 23 Javascript
详解JavaScript 作用域
Jul 14 Javascript
JavaScript实现鼠标经过表格某行时此行变色
Nov 20 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图片加水印原理(超简单的实例代码)
2013/01/18 PHP
PHP下使用CURL方式POST数据至API接口的代码
2013/02/14 PHP
php判断输入是否是纯数字,英文,汉字的方法
2015/03/05 PHP
php多重接口的实现方法
2015/06/20 PHP
php for 循环使用的简单实例
2016/06/02 PHP
php获取开始与结束日期之间所有日期的方法
2016/11/29 PHP
jQuery ui 1.7更新小结
2009/08/15 Javascript
原生js实现给指定元素的后面追加内容
2013/04/10 Javascript
js 操作select与option(示例讲解)
2013/12/20 Javascript
js数组依据下标删除元素
2015/04/14 Javascript
ECMAScript中函数function类型
2015/06/03 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐二)
2016/07/12 Javascript
vue 实现 tomato timer(蕃茄钟)实例讲解
2017/07/24 Javascript
使用Ajax和Jquery配合数据库实现下拉框的二级联动的示例
2018/01/25 jQuery
vuejs 制作背景淡入淡出切换动画的实例
2018/09/01 Javascript
es6基础学习之解构赋值
2018/12/10 Javascript
详解Vue.js和layui日期控件冲突问题解决办法
2019/07/25 Javascript
Angular8基础应用之表单及其验证
2019/08/11 Javascript
vue elementui tree 任意级别拖拽功能代码
2020/08/31 Javascript
[00:55]深扒TI7聊天轮盘语音出处3
2017/05/11 DOTA
python批量下载图片的三种方法
2013/04/22 Python
python网络编程示例(客户端与服务端)
2014/04/24 Python
python中函数总结之装饰器闭包详解
2016/06/12 Python
python利用rsa库做公钥解密的方法教程
2017/12/10 Python
python的格式化输出(format,%)实例详解
2018/06/01 Python
python实现随机漫步方法和原理
2019/06/10 Python
ERLANG和PYTHON互通实现过程详解
2019/07/05 Python
python2爬取百度贴吧指定关键字和图片代码实例
2019/08/14 Python
Django框架模板用法入门教程
2019/11/04 Python
django 数据库返回queryset实现封装为字典
2020/05/19 Python
Python 排序最长英文单词链(列表中前一个单词末字母是下一个单词的首字母)
2020/12/14 Python
顶岗实习协议书
2015/01/29 职场文书
军训个人总结
2015/03/03 职场文书
自主招生推荐信怎么写
2015/03/26 职场文书
2015年百日安全活动总结
2015/03/26 职场文书
javascript遍历对象的五种方式实例代码
2021/10/24 Javascript