对于前端开发人员,在开发过程中经常需要监控某些表达式或变量的值,如果使用用 debugger 会显得过于笨重,最常用的方法是会将值输出到控制台上方便调试。

最常用的语句就是console.log(expression)了。

从早前一道阿里实习生招聘笔试题目入手:

function f1() {console.time('time span');
}
function f2() {console.timeEnd('time span');
}
setTimeout(f1, 100);
setTimeout(f2, 200);function waitForMs(n) {var now = Date.now();while (Date.now() - now < n) {}
}
waitForMs(500);//time span: 0ms

我们先说说关于console的高级操作,最后在一起分析这道题目。

trace

console.trace()用来追踪函数的调用过程。

在大型项目尤其是框架开发中,函数的调用轨迹可以十分复杂,console.trace()方法可以将函数的被调用过程清楚地输出到控制台上。

function tracer(a) {console.trace();return a;
}function foo(a) {return bar(a);
}function bar(a) {return tracer(a);
}var a = foo('tracer');

table

使用console将对象以表格呈现

可将传入的对象,或数组以表格形式输出,相比传统树形输出,这种输出方案更适合内部元素排列整齐的对象或数组,不然可能会出现很多的 undefined。

        var people = {flora: {name: 'floraLam',age: '12'},john: {name: 'johnMa',age: '45'},ray:{name:'rayGuo',age:'22'}};console.table(people);

火狐的控制台:

time timeEnd

计算程序的执行时间

可以将成对的console.time()和console.timeEnd()之间代码的运行时间输出到控制台上

console.time('计时器');
for (var i = 0; i < 1000; i++) {for (var j = 0; j < 1000; j++) {}
}
console.timeEnd('计时器');

以上代码计算console.time('计时器');和console.timeEnd('计时器');之间的代码块所需要的事件。

profile

使用console测试程序性能

开发中,我们常常要评估段代码或是某个函数的性能。在函数中手动打印时间固然可以,但显得不够灵活而且有误差。借助控制台以及console.profile()方法我们可以很方便地监控运行性能。

function parent() {for (var i = 0; i < 10000; i++) {childA()}
}function childA(j) {for (var i = 0; i < j; i++) {}
}console.profile('性能分析');
parent();
console.profileEnd();

上述代码计算console.profile('性能分析');和console.profileEnd();之间,代码块中涉及的函数的运行效率。

现在说回笔试题目

题目考察应聘者对console.time的了解和js单线程的理解。

console.time()语句和console.timeEnd()语句是用来对程序的执行进行计时的。

setTimeout()接受两个参数,第一个是回调函数,第二个是推迟执行的毫秒数。setTimeout()只是将事件插入了"任务队列",必须等到当前代码(执行栈)执行完,主线程才会去执行它指定的回调函数。

因为f1和f2被都setTimeout事先设置的定时器装到一个事件队列里面。本来 f1应该在100ms后就要执行了,但是因为waitForMs占用了线程,而执行JavaScript是单线程的,所以就没办法在100ms后执行那个 f1,所以需要等500ms等waitForMs执行完,然后在执行f1和f2,这时候f1和f2就几乎同时执行了。

转载于:https://www.cnblogs.com/EnSnail/p/7647108.html

使用console进行 性能测试 和 计算代码运行时间相关推荐

  1. R语言统计代码运行耗时实战:计算代码运行时间、使用proc.time函数计算代码运行时间

    R语言统计代码运行耗时实战:计算代码运行时间.使用proc.time函数计算代码运行时间 目录

  2. js 使用console计算代码运行时间

    需求 如果学习前端一定时间以后,就会考虑性能方面的问题.那么问题来了,我们怎么计算出一段代码的运行时间呢? 使用console.log配合Date对象计算 比如,我们计算sort方法排序十万个随机数组 ...

  3. python time.time()计算代码运行时间

    计算一个代码跑多久 文章目录 1,time() 2.timeit() Timer() 用法1:在命令行上运行 用法2:在程序块中运行 单位问题: 1,time() import timestart = ...

  4. php计算代码运行时间与内存使用的一段代码

    计算运行时间及内存使用,代码如下: <?php //开始计时 $HeaderTime = microtime(true);//参数true表示返回浮点数值//代码//...printf(&quo ...

  5. 使用console.time打印代码运行时间

    如果你想知道自己写的代码运行时间,你可以使用console自带的方法console.time和console.timeEnd,像这样 console.time('test');var name = & ...

  6. 前端小知识:控制台打印(console)- 模拟Java日志打印、表格形式打印美化输出对象、代码运行时间统计

    文章目录 6. 控制台打印(Console) 模拟Java日志打印格式 美化对象打印(表格形式打印输出) 日志等级输出(让其在控制台显示时有颜色提示) 代码运行时间统计打印输出   6. 控制台打印( ...

  7. iapp启动图代码_关于计算设备运行时间SCL代码的测试与说明

    有小伙伴使用西门子PLC仿真软件对我前段时间写的文章<西门子SCL编程实例-计算设备运行时间(2)>进行了测试,发现OB10中的代码并没有执行,他问是不是代码有问题?尤其是这条语句: &q ...

  8. Python计算代码之间运行时间(运行间隔时间、时长)

    Python3.8以下使用time.clock() 通过代码统计 导入time库:import time 代码开始前获取开始时间:time_start = time.clock() 代码结束后获取结束 ...

  9. python怎么设置代码执行时间_python 代码运行时间获取方式详解

    我们知道为了提高代码的运行速度,我们需要对书写的python代码进行性能测试,而代码性能的高低的直接反馈是电脑运行代码所需要的时间.这里将介绍四种常用的测试代码运行速度的方法. 第一种:使用time模 ...

最新文章

  1. 安卓开发|自定义监听器的三个步骤
  2. 精品软件 推荐 ACPsoft PDF Converter 免费的多功能 PDF 转换器
  3. 软件工程-c语言--基于at89c51单片机c语言编写的计算器,基于AT89C1单片机C语言编写的计算器.doc...
  4. 计算机会计和传统手工会计的区别,手工会计与计算机会计之间的区别.doc
  5. Ubuntu命令参考手册
  6. Unity3D物理渲染算法研究【PBR】
  7. 三款常用IP发包工具介绍
  8. sql server 函数根据分隔符号拆分字符
  9. c语言 r语言 java,R语言rJava包安装载入及JAVA环境配置
  10. python 批量视频编辑_python实现批量视频分帧、保存视频帧
  11. Java实现3DES加密解密(DESede/ECB/PKCS5Padding使用)
  12. 什么叫侧面指纹识别_新科技?侧面指纹解锁有什么不同?
  13. 练习题记录:求解距离矩阵,首先生成一百个二维坐标点,计算任意两个坐标点的距离
  14. Strut 2的值栈
  15. Red Linux 6.0下安装Oracle 10g
  16. MySQL Group Replication [Multi-Primary Mode] 详细搭建部署过程
  17. 已知空间中的三点 求三角形面积_【气宇轩昂】解三角形最值问题的四大模型尤其是第四种模型,简直不要太赞哦!!!...
  18. C++实现自己的文本转语音程序(简单版)
  19. 2020年11月计算机二级题库,2020年全国计算机二级考试试题题库(附答案)
  20. maxvalue mysql自动分区_mysql 表分区按照数据量自动分区+定时器

热门文章

  1. 多项目加载顺序修改_面试官:Java 类在 Tomcat 中是如何加载的?
  2. ceph 查看是否在恢复_Ceph monitor故障恢复探讨
  3. python五位回文数_蓝桥杯,特殊回文数,Python
  4. 程序设计教程用c 语言编程,程序设计教程--用C 语言编程
  5. 64位浮点数_浮点数误差
  6. 测试文档模板_学会word2007创建自定义模板的方法,让你新建的文档结构都一致...
  7. Android NDK开发之 ARM与NEON指令说明
  8. 如何测试网站服务器mysql数据库连接,如何测试网站服务器mysql数据库
  9. arduino的矩阵示例程序_用树莓派 Arduino 制造 LED 矩阵彩灯
  10. python 与栈 入门