了解不同的断点类型，才能方便快速选择适合当前情况的 debugger 模式，快速发现主要矛盾，然后完成你的 debug 游击战
代码行设置断点
打开 devtools：
- 点击 Sources 面板
- 打开要设置要断点的文件
- 在代码行点击蓝色图标，显示蓝色图标后即可在下次运行时停止到此处，等效 debugger;
从代码中调用 debugger 即可在该行暂停
const a = 123;
debugger; // 代码行设置断点
console.log('will stop at debugger row');
基于条件的代码行断点
如果你想停止执行，但仅在某个条件为 true 时停止，请使用条件代码行断点
当您想要跳过与您的用例无关的断点（尤其是在循环中）时，此类断点非常有用。
操作如下：
- 打开 Source 面板
- 打开对应的文件
- 点击左侧行打一个蓝色的断点
- 鼠标右键选择 “编辑断点”
5. 选择 “条件断点”
- 在对话框中输入符合断点的条件
- Enter 键激活断点
- 最后可以在 Scope 中查看结果值
日志断点
操作大部分和基于条件的代码行断点，在编辑断点后：
- 选择断点类型为 “Logpoint”
- 按 Enter 键激活断点。行号列顶部会显示一个带有两个圆点的粉色图标
⚠️： 这里输入的内容需要遵循 console.log(...args), args 的参数，比如 "name ", name," age: ",age
debug 未捕获 or 捕获的异常
debug 未捕获适用场景： 一个用户说点击登陆后页面直接洗白了，此时你只需要在 Sources 面板的 Breakpoints 部分中，启用以下任一选项或同时启用这两个选项，然后执行用户的操作后即可看到错误
怎么跳过断点
打开某些网站的控制台的时候可能会发现 sources 里有一个去不掉的 debugger 代码阻止了爱学习的你去 debug，此时你可以点击 “一律不在此处暂停” （Continue to here) 跳过断点
跳过后就可以看见他的“庐山真面目”了！恭喜老铁又学习了一招
