vscode怎么运行html快捷键 如何更优雅地调试Javascript？
如何更优雅地调试Javascript？
抄袭我的文章，大家可以简单看一下(截图可以 不可复制，抱歉)
介绍
在我们的日常开发中，经常会遇到JavaScript的调试问题，而我们传统的解决问题的方法是使用大量的console.log或者其他方法的console对象，这样会给我们带来很多不便，尤其是遇到复杂的问题，可能会导致大量的console.log，而我们在排除故障后还要回去删除这些调试信息，这就大大降低了我们的工作效率。因此，我们有必要寻找一种更好的解决方案来解决JavaScript的调试问题。毫无疑问，Chrome的调试工具Chrome DevTools给我们带来了调试遍历。让 让我们一步步学习DevTools中调试的基本工作流程！
步骤1:确定我们需要调试的地方。
让 让我们通过一个简单的案例来模拟一下。本案例来自官方网站 的调试演示，代码如下。
然后是index.js
代码的初衷是做简单的加法，但是让 让我们运行并看看结果:
很明显，执行结果是错误的，结果应该是33。我们假设这是我们在开发中遇到的问题。
第二步:打开Chrome的调试面板。
命令选项I (Mac)或控制Shift I(Windows、Linux)或F12。
单击源选项卡。源有三个面板。
从左边看，是的
文件导航器窗格。此处列出了页面请求的每个文件。
代码编辑器窗格。在文件导航器窗格中选择一个文件后，该文件的内容将显示在这里。
JavaScript调试窗格。用于检查页面JavaScript的各种工具。如果DevTools窗口布局较宽，此窗格将显示在代码编辑器窗格的右侧。
使用断点暂停代码。
通常我们会在这里写console.log。中断断点后，我们将填写两个数字提交。
我们的代码在断点处暂停，所以我们可以直观地看到我们需要看到的变量值。简单来说，断点可以快速方便的看到你想看到的值。有时候我想单步调试代码，只是F10，当我想进入功能时按F11。我们像猜测的那样调试了这个，因为是字符串，所以数字表示连接，导致结果错误。
使用控制台直接评估
我认为这是最值得称赞的功能，因为我们可以直接在控制台中输入变量或表达式或者执行一个函数。我们打开控制台选项卡并输入以下内容，前提是是我们在之前的地方破了点。
我们可以执行需要执行的函数和表达式，然后就可以正确的看到结果了。知道它的人可能会认为它 没什么，但是不喜欢的人。;t know它可能觉得这个函数很好看，也可以直接修改代码保存后再执行，也不用去编辑器修改就知道结果了。调试正确后直接复制就行了。
摘要
本文只是想通过一个简单的案例介绍来改变我们传统的js调试方法，目的是提高工作效率。当然还有很多其他调试javascript的方法，比如在WebStorm和VSCode中安装Debug for Chrom
vscode支持哪些编程语言？
Vscode支持以下37种语言或文件:
F#、HandleBars、Markdown、Python、Jade、PHP、Haxe、Ruby、Sass、Rust、PowerShell、Groovy、R、Makefile、HTML、JSON、TypeScript、Batch、Visual Basic、Swift、Less、SQL、XML、Lua、Go、C、Ini、Razor、Clojure、C#、Objective-C、CSS、JavaScript、Perl、Coffee Script、Java、Dockerfile。
版权声明：本文内容由互联网用户自发贡献，本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。
