Chrome js调试

以用户登录页面为例，进入用户登录页面，点击F12

点击sources，在这里能看到我们项目的资源文件，我们可以在js代码行号前点击设置或取消断点

出现56和61行这样的图形就说明这行设置了断点

然后点击登录按钮，此时会进入debug模式

在右上角可以看到这几个按钮

Pause/Resume script execution：暂停/恢复脚本执行（程序执行到下一断点停止）。

Step over next function call：执行到下一步的函数调用（执行当前断点所在行，跳到下一行）。

Step into next function call：进入下一个函数。

Step out of current function：跳出当前执行函数。

Step：单步执行

Deactive/Active all breakpoints：关闭/开启所有断点（不会取消）。

Pause on exceptions：异常情况自动断点设置。

这里说明一下这几个step over，step into和step out的区别 Step Over：在单步执行时，在函数内遇到子函数时不会进入子函数内单步执行，而是将子函数整个执行完再停止，也就是把子函数整个作为一步。有一点，经过我们简单的调试，在不存在子函数的情况下是和Step Into效果一样的（简而言之，越过子函数，但子函数会执行）。 Step Into：单步执行，遇到子函数就进入并且继续单步执行（简而言之，进入子函数）。 Step Out：当单步执行到子函数内时，用Step Out就可以执行完子函数余下部分，并返回到上一层函数。