VSCode中怎么开启调试模式?三种方式浅析

本篇文章给大家介绍一下试模式的必要性,聊聊VSCode中开启调试模式的三种方式,希望对大家有所帮助!

VSCode,调试模式

在代码编写或者维护(修 bug )的过程中, 对于简单的值或者问题, 我们可以通过console来解决, 甚至有人认为console大法好, 是银弹, 能解决所有问题, 我认为并不是的. 对于想要理清楚代码的执行逻辑, 还有查看复杂类型(引用类型)的值时, 还是得使用到调试模式(debugger) 的。https://juejin.cn/post/7024890041948176398#heading-1

debuggerjs 中的一个语句, 运行到这一行, 如果程序是在调试模式下, 会断点, 就是会停在这一行, 那么我们就可以看到此时的上下文环境, 包括最重要的变量的值, 和调用堆栈. 然后还支持我们单步调试, 或者逐块调试.

平时在浏览器中调试的比较多, 在浏览器中, 只需要打开控制台, 开启了调试模式, 然后遇到debugger语句, 或者自定义的断点, 就会让程序停下来, 进入debug模式.

VSCode,调试模式

这篇文章主要是会讨论一下在vscode中开启调试模式的方法, 因为我准备写一个vscode插件(敬请期待哈), 调试vscode就在所难免了, 之前的简单调试也肯定满足不了我的需求了, 所以来了解一下vscode的调试模式.

这篇文章不会写调试的技巧, 只是会写一下, vscode怎样开启调试js. 这里是vscode官方文档

再论调试模式的必要性

如果只需要看一个简单的值, 那么完全可以使用console, 因为开启调试模式的成本比较大.

在浏览器中, 因为对象是引用类型的并且浏览器不会直接将对象完成折叠开, 所以如果console之后修改了对象, 再到控制台去看, 得到的将是修改后的对象了

打印后并没有自动全部折叠开

VSCode,调试模式

去手动折叠开的时候, 浏览器再去读值, 已经变成了修改后的值

VSCode,调试模式

这种问题的出现, 是因为对象, 所以如果我们转字符串再打印就不会有这个问题, 但是, 不好看, 这里只是举个例子, 有些情况下还是需要用调试模式的.

vscode中开启调试模式

vscode中调试js,ts代码, 有三种方式

  • vscode终端里运行node时, 自动附加, 见3.1.

  • 直接使用vscode提供的debug终端, 见3.2

郑重声明:本文版权包含图片归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们(delete@yzlfxy.com)修改或删除,多谢。

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

留言与评论(共有 0 条评论)
昵称:
匿名发表
   
验证码: