谷歌浏览器调试JavaScript代码

谷歌浏览器调试JavaScript代码

由于在前端是一个弱类型语言，虽然现在增加了ESLint，Flow等静态检查，但是这些检查工具只能帮你检查出一些代码的显式问题，很多隐藏的逻辑性问题我们只能通过console去输出，但是有些时候打印出来的结果不尽人意，于是，我便找阿里的前辈学习了如何使用debugger去调试代码

如下代码

function a () {
  let i = 1;
  i++;
  i++;
}

我们需要让它每次加一的时候直接看到i的变化，通常我们选择在每次改变的时候在控制台输出：

function a () {
  let i = 1;
  i++;
  console.log(i); // 2
  i++;
  console.log(i); // 3
}

这样的话，我们每次就可以看到i的变化了

但是，今天我准备用一件神器：debugger

​

function a () {
  debugger;
  let i = 1;
  i++;
  i++;
}

debugger其实就是在你的程序里打上一个断点（类似于Java里的断点调试），程序运行到这里的时候，会卡在这里，除非你运用命令（下一步、跳过ÿ