前端开发必备调试技能-console

1、我们先来使用console中的dir方法查看一下console对象中的属性方法，对console对象所包含的内容有个大致的了解：

console.dir(console);

2、下面我们依次来介绍几个常用的方法：

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

console.log()主要用于输出普通信息，可同时输出多个对象信息，中间用逗号分隔。

笔者常使用以下形式：

console.log(obj,message)，输出obj对象信息，使用字符串对象message标识输出信息的概述。

3、与console.log()相类似的方法还有console.info()、console.error()、console.warn()、console.debug()。

上述这五种主要用于输出信息的方法同时还使用printf风格的占位符。

支持字符（%s）、整数（%d或%i）、浮点数（%f）和对象（%o）四种占位符，示例如下：

console.log(“%d年%d月%d日”, 2017, 12, 03):

4、console.dir():用于输出对象详细信息，注意其与console.log()的区别，对比图如下所示：

5、console.clear()

用于清除此语句之前，控制台打印出来的所有信息：

6、console.table():以表格的形式展示数组类数据，能够使数据一目了然(提升逼格必备良品)：

7、console.group():输出一组信息的开头

console.groupEnd():结束一组输出信息

这两者组合使用，可将要显示的信息分组展示，对于展示内容而言更加清晰自然。

8、console.time()、console.endTime():

两者组合用来测试循环用时之类的程序片段运行所用时长极其方便。(注意其参数设置，两个组合方法中参数需一致)：

9、console.assert():对表达式进行断言，只有表达式为false时，才输出相应的信息到控制台，具体如下图所示：

10、console.trace(): 

常用于堆栈跟踪相关的调试

这里给一个错误的方法调用(前图)：

打印信息如后图所示：