对js进行断点调试

有些程序太过繁杂,程序出错不好找出错误在哪,所以需要断点调试一步步得出结论。

1.在需要加断点的地方写debugger;

function customDebug() {
    for(var i = 0; i < 10; i++) {
        console.log(i);
        if(i % 3 == 0) {
            console.log('3的倍数要暂停');
            debugger;
        }
    }
}
customDebug();

将上面的程序复制js文件中执行, 就会弹出如下界面,这里以谷歌浏览器为例,程序会立即在debugger断点处停止。当前i = 0,断点就是debugger,不断点击右上角的两个箭头的一个就可以一步一步的进行断点调试了,推荐点后面的那个,步骤更详细。

对js进行断点调试_第1张图片

2.使用IDE工具进行断点调试,这里以vsCode为例。

首先在需要进行断点调试的代码行前面点击,生成一个红色的断点。

然后点击调试-->启动调试会出现如下页面,点击调试按钮继续调试。
对js进行断点调试_第2张图片

3.浏览器调试 

在sources下找到js文件,在79行前点击添加断点然后刷新页面。剩下的与上面的操作一致就可以。

对js进行断点调试_第3张图片

你可能感兴趣的:(IDE)