断点调试

\color{rgba(254, 67, 101, .8)}{断点调试}

\color{rgba(254, 67, 101, .8)}{断点调试可以帮我们观察程序运行的过程}

1.浏览器按F12
2.点击sources
3.找到要调试的文件,双击此文件
4.在程序的某一行的行号处设置断点,然后刷新浏览器,浏览器刷新过后会一直在转圈,就表示已经开始在执行代码了,只不过此时是卡在了代码的某一处,所以一直转
5.此时鼠标放到变量上去,就会看到变量执行到了几

image.png

或者不用鼠标放到i上去,点击watch后面的 + 号,然后输入要查看的变量,就会显示出此时变量的值

image.png
image.png

此时可以看到,在sourse中,i的值已经跳到了7,而在console中,也输出了6次你好吗

watch:监视,通过watch可以监视变量的值的变化
F11:程序单步执行,让程序一步一步的执行,这个时候,观察watch中变量的值的变化。
打断点是调试BUG的重要手段

\color{rgba(254, 67, 101, .8)}{如果要退出代码调试,再点一次行号,就取消调试了}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容