你真的会用console吗—前端开发

你真的会使用console吗

1. console.table表格形式打印

console.log是我们最常用的打印方法，但是在打印一些比较复杂的数据时候，我们浏览起来就会显得很费力。比如：

而使用console.table打印就会自动生成表格，使打印结果看起来更加清晰易懂：

2. console.dir打印对象

console.dir与console.log不同之处在于，前者可以递归打印对象的所有属性，而后者侧重于字符串化的打印。比如要打印一个DOM节点。

console.log只是把html节点打印出来，而console.table把DOM对象的所有属性打印出来。

console.log附带样式打印

细心的朋友可能会发现许多网站会在Chrome控制台打印许多提示信息，而且还附带样式，看起来非常的惊艳。比如天猫：

但是样式具体要怎么打印呢。
其实很简单，只需要在打印的字符串前加上%c就可以添加样式了。
还可以通过%s,%d等插入数据，和C语言printf相似。

console.trace追踪函数调用

console.trace() 方法用于显示当前执行的代码在堆栈中的调用路径。通过在某个方法中打印一些信息，可以快速定位到该方法所在的文件和文件内具体位置，以及查看函数的调用栈。

console.assert条件打印

assert方法接受两个参数，第一个参数是表达式，第二个参数是字符串。只有当第一个参数为false，才会输出第二个参数，否则不会有任何结果。比如：

例子中就只输出了条件不成立，而且用红色警示展示。

console.count技术打印

相信在平时我们开发经常会去测试一些代码执行的次数，一般我们都会声明一个变量记录次数，最后console.log打印结果，其实浏览器内置给我们提供了这种方法。

console.time和console.timeEnd计时打印

计时也是非常好用的一种打印方法，为了性能优化，我们可能经常定位一些执行时间较长的代码段，平时很多人会通过Date.now()计算，但其实浏览器也为我们提供好了这种方法，不仅方便好用而且时间也是格式化好的。