这是我参与「第五届青训营 」伴学笔记创作活动的第9天
PC端
任何一个浏览器的DevTools 是最常用的调试工具。
1.console系列
在代码中添加了console系列后,就可以直接在控制台看到所需要打印的数据，但是有一个比较麻烦的地方，就是需要反复添加删除。
- console.log() ,包含占位符
%s %c %d %f %o - console.warn()
- console.error()
- console.info()
- console.time()，以及配对的console.timeEnd()
- console.table()
- console.trace() 追踪当前代码在堆栈中调用路径
- console.dir() 对象是个obj，打印这个的详情
2.Bom的alert
这种很少使用，因为调试体验太差，并且展示的数据不全，当调试数据是Obj的时候，会出现[object Object]，并且各个浏览器弹出的样式还不统一一致；老版IE特别难用。但是使用起来也是很简单。
因此不推荐；
3.代码debugger
这种使用方式也是很简单，直接在代码中需要断点的地方，直接添加代码debugger即可，当js执行到该语句的时候，会自动暂停，进而可以看到详细的信息，也可以一步步的调试代码。不过后面一定要删除该语句，否则有意外之喜。
4.浏览器断点
在浏览中断点和在代码中断点的操作原理一样，但是浏览器断电可以省去删除代码中bedugger的方式，F8可以直接跳转到下一个断点，F10可以单步骤调试，F11可以直接进入方法，也相当于单步调试了。
移动端
一般开发者工具里会有对应的调试工具，和PC端的差不多，真机调试的话需要用数据线连接两个设备，并且需要额外的插件进行调试。
DEBUG魔法
使用小黄鸭大法，把bug代码对着小黄鸭说一遍，小黄鸭告诉你怎么解决。
