[js] 第203天 你平时是怎么调试js的？会断点调试吗？断点调试有什么技巧呢？
Opened this issue · 5 comments
第203天 你平时是怎么调试js的？会断点调试吗？断点调试有什么技巧呢？
用debugger 在浏览器的F12里进行调试，如果有跳转，要在跳转/同步请求之前debugger
jquery 时代还能通过绑定事件的元素找到相应代码，后来就哦豁了，
现在要么改代码书写 debugger 或者用 vscode 的调试方案。
F8 跳到下个断点，F10 跳到下一行，
到达一个方法后还能向方法内部跳，
看 scope 可以看到各变量的情况，Call Stack 即调用栈，
其实在 dom 上也可以打断点，类似使用 MutationObserver，
在本地调试时还能直接在面板中修改代码，其他就不知道了。
当然 console 和 alert 调试法也是非常不错的。
还有种我个人用来处理不知道哪里出错（比如事件异步太复杂）的办法就是注释法，
一段段地去注释掉，直到发现注释掉哪里后正常或异常时，慢慢就能找到问题所在了。
用的最多的还是console.log，因为现在的代码几乎都有sourceMap的原因，有时候断点调试并不友好(代码跳到底层源码、压缩前后的变量名不一致导致看到的变量名和实际变量名不一致，断点处不能显示真实值)；形成断点有两种方式，一是在代码中写debugger，而是在devTools中的source面板打断点，平时用的最多的就是hover查看变量值，还有断点所到的作用域都会在console上，所以可以在console中打印局部变量进行查看等等功能。
看个人习惯，log是最基本的反应error的问题，但是log可以看到步骤中出错在那个环节
基本都是用的debugger，consoloe用的也比较好，还可以在调试的时候双击点击某方法打断点。