# 如出一辙：Chrome 的 Debug

我们在前面的训练中已经了解了怎么在 VScode 中使用快捷键进行代码的 Debug，但是在大部分时候，我们都是在 Chrome 上 Debug，为了尽可能提高我们的效率，我们必须要了解一下它的快捷键操作。

## 基础操作

- `command` + `b` / `command` + `shift` + `b`：在光标所在行打断点，如果该行已有断点则取消该断点；区别是用第一个组合键取消断点时，会完全取消，在 BreakPoint 面板中不会有记录留下；而用第二个组合键来取消则该断点时，断点标记不会完全消失，会变成半透明样式，且记录还会在 Breakpoints 面板上，以供随时重新打上该断点；
- `command` + `'` / `f10`：step over；
- `command` + `;` / `f11`：step into；
- `shift` + `command` + `;`：step out；
- `command` + `\` / `f5`：停止当前的断点；
- `command` + `f8`：停止所有的断点；

可以看到，这部分的命令和之前的练习 [VScode Debug](../vscode/day-30.md) 中是类似的，这样一来我们的快捷键使用也会更加统一。

## 小技巧

- `command` + `shift` + `e`：把选中的代码值输出到 console 面板；
- `command` + `shift` + `o`：打开跳转到函数面板，与前面的 [VScode 单文件搜索符](../vscode/day-21.html#快捷搜索符号)类似；不过选择列表中只有函数，不会显示变量等其他的值；
- `ctrl` + `g`：弹出输入框，输入数字可跳转到指定行；

在这几个命令的使用过程中或者前面提到的一些命令你可以发现，有些地方还是要用到鼠标操作，比如选中代码变量，比如在代码面板和代码文件面板的切换，这是肯定的；因为我们无法也没有必要要求所有操作都用键盘操作，只有在适合的场景用适合的方法，才能最大地提提高我们的效率。