任何程序员都必须调试代码。无论你是高手还是新手，调试程序都是一项必不可少的工作。一般来说，调试程序都是在代码写完之后或者在测试期间修改bug的时候进行的，这样可以更好的反映程序员的水平和代码调试时问题分析的准确性。很多初学者在寻找错误的原因时，总是跑题，花了很多时间却解决不了一些被证明相当简单的bug。掌握各种调试技巧，一定会事半功倍。比如快速定位问题，降低故障概率，帮助分析逻辑错误等等。在互联网前端开发日益重要的今天，降低开发成本、提高工作效率、掌握前端开发中的调试技巧显得尤为重要。

本文将逐一讲解各种前端JS调试技巧。也许你已经掌握了，让我们一起来复习一下。也许有你没见过的方法。可能你还不知道怎么调试它们，借此机会填空。

1、骨灰调试大师警惕

那是互联网刚刚起步的时候，网页前端主要是内容显示，浏览器脚本只能为页面提供非常简单的辅助功能。当时网页主要在基于IE6的浏览器中运行，JS的调试功能还很弱，只能通过Window对象内置的alert方法进行调试。这时候，应该是这样的：

需要注意的是，这里看到的效果不是当年IE浏览器看到的效果，而是更高版本IE看到的效果。另外，当时好像没有这样的高级控制台，alert的使用也是在真正的页面JS代码中。虽然alert的调试方法比较原始，但在当时确实有其不可磨灭的价值，甚至到了今天，已经有人在使用了。

2.新一代调试王控制台

随着JS在Web前端能做的事情越来越多，其职责也越来越大，地位也越来越重要。传统的告警调试方法已经逐渐不能满足前端开发的各种场景。而且告警调试模式弹出的调试信息也不是很美观，会屏蔽一些页面内容，真的很不友好。

另一方面，对于告警的调试信息，类似‘alert(