【微信小程序】新手入门必须掌握开发工具的代码断点调试步骤

掌握开发工具基本的代码断点调试步骤，新手可以更加有效地进行代码调试和找出问题并得到解决。

一般人不会告诉你的自查自纠方法与技巧;

新手入门必须掌握的代码断点调试步骤包括以下几点：

设置断点

首先，需要了解并设置断点，以便在代码执行过程中暂停执行；

在需要打断点的代码里,添加一行代码如下

debugger;

它的作用就是打开调试器, 自动定位到执行的代码, 像下图这样

然后,点击开发工具的编译运行, 它将会运行到Sources源代码的断点处

在调试器里面展示的, 左侧行号就可以设置断点, 如下图

高亮显示蓝色底的行号就是断点,

断点还可以设置很多个, 这样就不需要每次都加debugger,

若设置错了, 重新点击设置的断点所在行号就可取消

执行调试

其次，学会逐步执行代码，以观察代码的执行过程；

在调试器的右侧上边, 如下图, 本人标注为绿色的一排图标键

一排图标键解释顺序如下:

• 第二个怎么说, 是跳过去, 点击后, 如果当前是方法(函数)名,就会执行跳过到下一句;
• 第三个怎么说, 是下去的, 点击后, 如果当前行是方法名, 就下到方法(函数)里, 执行里面第一句代码;
• 第四个怎么说, 是上来的, 点击后, 如果当前行是在方法(函数)里面,就会执行完里面的代码后, 上来到出口, 再到下一句代码;
• 第五个怎么说, 是前进的, 就是点击后, 执行到下一句(行);

查看断点

如果设置了断点, 下次点编译运行, 它都会自动执行到断点处,

方便查看当前的状态, 如下图

在右侧有个Local，可查看和修改变量的值，

继续执行

最后，需要掌握如何恢复程序的执行，以便在调试完成后继续运行程序。

如下图, 第一个就是, 点击后就会继续执行,

如没有下一个断点, 就会执行到程序结束

如果执行到死循环了, 就点击第七个按钮图标, 它就会暂停

忽略断点

如果认为问题解决了, 可以点击忽略断点, 查看运行是否正常

如下图, 第六个就是个复选框, 点中就会忽略断点执行,

如果记得住, 可按组合快捷键Ctrl + F8 来切换;
其它的按钮图标也有对应的快捷键, 移动鼠标箭头到它的上面就会提示

通过上述代码的断点调试，我们能够更深入地理解代码的运行逻辑，从而精准地定位bug问题所在并进行修复。