Web Inspector 参考Console 对象 API

console 对象可以说是 JavaScript 最有用的调试工具之一。

您可能已经熟悉 console.log，它在 Web Inspector 的控制台中生成交互式可视化内容。

但您是否知道还有许多其他函数，每个都提供额外的调试功能？

以下是完整列表

• console.debug([...data]) 会向控制台输出一条“调试” 消息。
• console.error([...data]) 会向控制台输出一条“错误” 消息。
• console.info([...data]) 会向控制台输出一条“信息” 消息。
• console.log([...data]) 会向控制台输出一条“日志” 消息。
• console.warn([...data]) 会向控制台输出一条“警告” 消息。

---

• 如果给定的 condition 为假值，console.assert([condition [, ...data]]) 将会向控制台记录一条“错误” 消息。
• 不提供 condition 等同于一个假值。
• 这还会触发 断言失败 JavaScript 断点。

---

• console.trace([...data]) 将在控制台中显示一个堆栈跟踪。

---

• console.clear() 是一种以编程方式清除控制台的方法。

---

• console.count([label]) 会记录 console.count 以给定 label 被调用的次数。
• console.countReset([label]) 会重置给定 label 的 console.count 计数。

---

• console.dir([item]) 强制 Web Inspector 将给定 item 作为对象进行可视化。
• 在实践中，唯一的显著区别是当给定 item 是一个 DOM 节点时。
• console.dirxml([...data]) 强制 Web Inspector 尝试将给定 data 中的每个项作为 DOM 节点进行可视化。

---

• console.group([...data]) 创建一个可折叠的消息组，后续的控制台消息将嵌套在该组下。
• console.groupCollapsed([...data]) 的工作方式与 console.group 相同，但消息组一开始是折叠的。
• console.groupEnd([...data]) “关闭”最近的消息组。

---

• console.profile([title]) 是一种以编程方式启动新的时间线记录的方法，将给定 title（如果提供）作为名称。
• console.profileEnd([title]) 是一种以编程方式停止现有时间线记录的方法，该记录的名称与给定 title（如果提供）匹配。
• console.timeStamp([message]) 会向活动时间线记录添加一个标记。

---

• console.record(target [, options]) 是一种以编程方式为给定 target 启动新的canvas 记录的方法，并附带配置 options（如果提供）。
• singleFrame 指示在捕获单个渲染帧后，canvas 记录是否应自动停止记录。
• frameCount 指示在canvas 记录自动停止记录之前要捕获多少个渲染帧。
• 如果提供，frameCount 优先于 singleFrame。
• memoryLimit 指示在canvas 记录自动停止记录之前允许的最大大小（以 MB 为单位）。
• name 指定 Web Inspector 在图形选项卡中列出canvas 记录时使用的标题字符串。
• console.recordEnd(target) 是一种以编程方式停止给定 target 上的现有canvas 记录的方法。

---

• console.screenshot([target [, ...data]]) 捕获/生成给定 target（如果提供）或视口中可见内容的图像截图。

  这适用于附加到主 document 的 DOM 节点、图形 DOM 节点（例如 <img>, <video>, <canvas> 等）以及其他图形对象（例如 ImageBitmap, canvas 渲染上下文等）。

---

• console.table(tabularData, properties) 将给定 tabularData 值渲染为控制台中的 <table>。

---

• console.takeHeapSnapshot([title]) 是一种以编程方式捕获堆快照的方法，将给定 title 作为名称。

---

• console.time([label]) 启动一个计时器，并带有给定 label（如果提供）。
• console.timeLog([label [, ...data]]) 记录带有给定 label（如果提供）的计时器经过的时间。
• console.timeEnd([label]) 停止带有给定 label（如果提供）的计时器并记录经过的时间。

---

字符串格式化和样式

console 消息函数（例如 console.log）也支持替换符

• %s 将对应值转换为字符串。
• %d / %i 将对应值转换为整数。
• %f 将对应值转换为浮点数。
• %o 显示对应值，如同它是 console.log 的独立参数一样。
• %O 显示对应值，如同它是 console.dir 的独立参数一样。
• %c 将对应值作为 CSS 应用。