|||||故事：
我为什么要讲这个呢，这段时间，我在公司，有几个人对我使用debug调试的效果眼前一亮
|||||作用：
debug意译为调试。不知道你有没有这样一种情况，明明有bug，却找不到原因，一直控制台输出日志，苦苦不得结果。这个时候你就有必要认识一下debug这个东西了
|||||背景：
我个人一开始很拒绝debug，因为用起来比较复杂，不知道咋用，网上教程也说不明白，所以我对控制台输出调试情有独钟。后来，随着项目的复杂化，你对项目的了解便成了盲人摸象，解决bug，理清逻辑，光靠控制台就显得捉襟见肘了。一开始我主要做前端，用的是chrome debug，你可以在chrome中的代码上直接打断点，也可以在编辑器中通过debug语句打断点，这样就能一行一行执行代码，看哪里出了问题。后来主要做nodejs后端，chrome调试就不行了，就使用vscode做debug了。
|||||用法：
debug执行过程为，启动debug-->运行代码到断点停止运行-->你通过继续、单步跳过、单步调试按钮调试代码-->代码运行结束
debug模式有两个视图，一个是变量监视视图，这个视图会列出当前全局变量值和当前作用域变量值。另一个是代码视图，有一个游标指向当前正在执行的语句。
debug调试按钮介绍，继续按钮会放开当前断点，如果下边有断点，代码直接到下一个断点停止执行，如果下边没有断点，则代码执行完毕。单步跳过按钮为跳过断点这个语句，停止到下一语句，这个过程也叫代码一行一行调试。单步调试按钮会进入当前语句子环境，假设这一语句是调了一个函数，那么单步调试就会进入这个函数。单步跳过按钮，会退出子环境。
|||||示例：
假设你定义了一个全局变量，这个变量在代码运行过程中报了TypeError错误,代码很复杂，怎么去解决这个问题呢
笨方法：打断点到变量定义的地方，然后单步调试，一行一行执行，查看视图中这个变量值的变化
缩小调试范围法：打断点到变量定义的地方，在到结束的区间中多打几个断点，用继续按钮，去确定那个区间出了问题，缩小区间后，再在区间内一行一行调试
视图变量追踪：视图中，你可以定义监视报错的变量，这样单步调试就能清晰的查看变量值的情况
|||||其他用途
debug最重要的功能是调试代码bug，此外也能用作代码过程研究，例如你要了解控制台输出语句是怎么输出的，就可以把断点打到输出语句上，用单步调试进入输出函数，一步一步去看内在实现逻辑。同样也可以研究第三方库的API，以便修改掉第三方库不符合我方需求的逻辑