前两天在V2EX上瞎逛的时候,偶然看到这个帖子「发掘有趣的 console」。虽然也曾经注意过知乎、DNSPOD、Tmall这些把console玩的飞起的网站。觉得新奇膜拜以外,还真的没有花心思去研究过他们实现的过程。Console在我手中一直只是顺手的JS调试工具。所以花了一天的时间做了一下简单的功课。

Console是什么?

Console是一个JavaScript解释器的内置对象,用于访问调试控制台,在不同的浏览器里效果可能不同。我们最常用的console.log就是Console对象的一个静态方法,它的作用是将内容输出到控制台上。

Console都提供了什么功能?

console.debug(object[, object, …])

功能与console.log类似,输出将会包含对象超链接,多数情况下与console.log输出的效果一致。

console.info(object[, object, …])

功能与console.debug类似,输出会伴随一个”信息”图标,在Firefox中有效果。

console.warn(object[, object, …])

功能与console.debug类似,输出会伴随一个”警告”图标。

console.error(object[, object, …])

功能与console.debug类似,输出会伴随一个”错误”图标,在Webkit下的效果与未捕捉到异常类似。

console.assert(expression[, object, …])

断言函数, 如果expression的结果为假,将抛出一个异常并将其余参数作为异常描述输出。

console.clear()

清空控制台内容。

console.dir(object)

以列表形式输出对象, 效果类似于查看DOM。

console.dirxml(node)

以审查元素的形式输出HTML/XML元素。

console.trace()

追踪当前函数, 输出函数的调用痕迹。

console.group(object[, object, …])

对控制台输出分组,调用该方法后接下来的输出将会产生一个可折叠缩进块。

console.groupEnd()

关闭console.group或console.groupCollapsed打开的缩进块。

console.time(name)

以参数name作为计时器的名称,新建一个计时器。

console.timeEnd(name)

结束以参数name命名的计时器,输出console.time调用后经过的时间。

console.profileEnd()

关闭JavaScript性能分析器,输出报告。

console.count([title])

从1开始输出计数,参数title用于区别不同的计数器。

console.table(data[, columns])

以表格形式输出数据。