IE11 —— F12 开发者工具( 五 )


在代码的任意位置使用.time()以启动计时器,并使用.()以结束计时器并将结果发送到控制台 。如果要为你的计时器添加标签或需要多个计时器,请为.time()和.()方法传递具有作为参数的唯一标签的字符串 。如果不传递参数,这些方法将使用“”作为标签 。
断言
断言是另一种用于加速开发人员工作流的速记 。如果与.()一起使用的第一个参数评估为false,它将运行.error(),并将断言的额外参数用于错误消息 。
使用以下代码行:

console.assert(f < 25, 'f is not less than %d, but is instead %o', 25, f);

它等效于写入

if (!(f < 25)){
.error( 'f is not less than %d, but is%o' , 25, f)

。在示例代码中,我们使用了%o输出变量 。由于上述评估在变量值不为数字时将失败,所以使用%o使你可以查看变量本身,而非使其采用特定类型 。
跟踪和分析
了解从何处调用你的代码、正在运行哪个代码,以及执行任务需要多长时间,这些信息对于分析速度缓慢或异常行为非常有用 。
堆栈跟踪通过向上追溯路径的跟踪请求向你显示到达当前代码的执行路径 。在代码中使用.trace()以显示堆栈跟踪 。

IE11 —— F12 开发者工具

文章插图
该代码...

10
11
12
13
14
15
a(){
c();
b(){
c();
c(){
.trace()
d(){
b();
a();
d();

...在控制台中显示此输出 。
console.trace()
at c (http://www.contoso.com/trace.html:24:3)
at a (http://www.contoso.com/trace.html:18:3)
at Global code (http://www.contoso.com/trace.html:30:1)
console.trace()
at c (http://www.contoso.com/trace.html:24:3)
at b (http://www.contoso.com/trace.html:21:3)
at d (http://www.contoso.com/trace.html:27:3)
at Global code (http://www.contoso.com/trace.html:31:1)
在其他实例中,查看两点间运行的代码的每个部分将十分有用 。探查器是用于该目的的最佳工具,但在一些情况下可能需要比手动停止和开始更高的精确度 。
要从代码中精确地开始和停止探查器,请使用.()开始记录探查器会话,并使用.()停止记录 。
将字符串作为方法的参数传递到.(),以将其用作分析报告的名称 。
小心覆盖分析会话可能会创建异常报告 。在首次测试运行时使用.trace()替代.(),以确保不会在结束分析会话前多次调用.() 。如果发现获取的跟踪比预计的多,这可能是你的问题 。
管理消息以增强可读性
对消息进行编组 。
由于要处理发送到控制台的所有类型的消息和内容,跟踪它们可能十分困难 。使用以下命令以保持井然有序:
可以在另一个组中嵌套组,以便获得更详细的编组级别 。
要启用或禁用不同类型的消息,请使用筛选 。
在“控制台”工具的顶部,存在用于错误、警告和信息消息的图标,旁边带有每种类型的数量 。单击某个图标以切换该类消息显示的启用或禁用状态 。切换为禁用时,将隐藏该类消息(但没有删除),可以通过将该类消息重新切换为启用来还原它们 。
在控制台输出中右键单击显示具有复选框的上下文菜单,这些复选框可以切换三种主要消息类型以及使用.log()发送的消息 。
将发送到“控制台” 。
控制台不仅从代码显示输出,还提供用于执行代码的界面 。仅需在“控制台”底部的命令行窗格中输入任何有效。
在命令行中输入的所有脚本将在当前选定窗口的全局范围内执行 。如果使用或构建了你的网页,这些框架会将其自己的文档加载到自己的窗口中 。