Debugger是前端开发非常重要的工具。可以停在我们关心的代码处，单步运行理清逻辑。Debugger的好坏直接关系到断点的好坏。ChromeDevtools和VSCode都提供了Debugger，并且都支持6种类型的断点。普通断点你可以在你要打断的行的左边点击添加一个断点，运行到那里它就会停止。这是最基本的断点方式，VSCode和ChromeDevtools都支持这种断点方式。条件断点在代码所在行的左侧单击鼠标右键，会出现一个下拉框，可以添加条件断点。输入一个条件表达式，当这行代码运行到表达式的值不为空时就会停止，比普通的断点灵活多了。VSCode和ChromeDevtools也支持这个条件断点。DOM断点在ChromeDevtools的Elements面板中右键对应的元素，选择breakon，可以添加dom断点，即当子树发生变化，属性发生变化，节点被移除时，会断点。.可用于调试导致dom更改的代码。在DOM调试方面，只有ChromeDevtools支持这种断点。URL断点您可以在ChromeDevtools的Sources面板中添加XHRurl断点。当ajax请求对应到url时，就会断掉，可以用来调试请求相关的代码。此功能仅在ChromeDevtools中可用。EventListener断点在ChromeDevtools的Sources面板中，你还可以添加一个EventListener断点来指定事件发生时停止，可以用来调试与事件相关的代码。此功能也仅在ChromeDevtools中可用。异常断点在VSCode的Debugger面板中勾选UncaughtExceptions和CaughtExceptions添加异常断点，在抛出异常和未捕获或捕获异常时打断该列。用于调试一些抛出异常的代码。此功能仅在VSCode中可用。总结Debugger断点的方式是在对应代码行直接点击的普通断点之外，根据不同的情况添加断点。一共有六种：普通断点：运行到那个地方断条件断点：运行到这个地方且表达式为真断，比普通断点更灵活DOM断点：DOM子树变化，属性变化，节点删除时断可用于调试导致DOM变化的代码URL断点：当URL匹配某种模式时断点可用于调试请求相关代码事件监听器断点：触发事件监听器随时断点，可用于调试event-relatedcodeexceptionbreakpoints:breakwhenanexceptioniscatchedornotcatched,可以用来调试发生异常的代码这些断点方法大部分都是ChromeDevtools支持的（Normal,Conditional,DOM,URL,事件侦听器），还有一些由VSCode调试器支持（正常、条件、异常）。不同情况下的代码可以使用不同的断点方式，这样调试代码的效率会高很多。JS的6种断点方式你用过几种？
