详解Google Chrome浏览器（操作篇） - Alan_beijing(6)_H5之家

console.time('total'); console.time('init arr'); var arr = new Array(10000); console.timeEnd('init arr'); for (var i = 0; i < arr.length; i++) { arr[i] = new Object(); } console.timeEnd('total');

result:

18、console.timeEnd([label])

定义：Stops a timer. See console.time() for examples.

译文：停止计时器。以console.time()作为一个例子。

19、console.timeStamp([label])

定义：Adds an event to the Timeline during a recording session.

译文：在一个记录会话期间，添加一个事件到时间表。

示例：

console.timeStamp('check out this custom timestamp thanks to console.timeStamp()!');

result：

20、console.trace(object)

定义：Prints a stack trace from the point where the method was called.

译文：打印一个堆栈跟踪的方法。

示例：

function add(num){ if(num>0){ //you can pass lables and objects to trace,too. console.trace('recursion is fun:',num); return num+add(num-1); }else{ return 0; } } add(3);

result:

21、console.warn(object [, object, ...])

定义： Prints a message like console.log(), but also displays a yellow warning icon next to the logged message.

译文：不仅打印像console.log()的消息，而且也显示一个紧挨着输出消息的黄色图标。

示例：

console.warn('user limit reached!');

result:

小结：

大致介绍了Chrome console内置函数，其中，console.log(),console.info(),console.error(),console.warn()需要区别一下。

三、Sources面板

概述

Sources面板通过设置断点来调试 JavaScript ，或者通过Workspaces（工作区）连接本地文件来使用开发者工具的实时编辑器。在上一篇博文本篇博客详解Google Chrome浏览器（理论篇）中概述了Sources面板的主要功能，即断点调试、调试混淆的代码和使用开发者工具工作区进行持久化保存，本篇文章将结合Sources面板的主要功能，且从Source面板三个组成部分来叙述，下图红色字体标记。