微信

这个系列的下一步，会继续介绍这个微信小程序的控制器index.js的实现。在上一篇微信小程序视图源代码的讲解里，我们通过逐行讲解代码的方式，介绍了微信小程序视图的基本开发思路。但是讲控制器index.js， 仅仅采取静态的代码走查还不够，我们需要将微信小程序启动起来，通过单步调试的方式逐行讲解，通过控制器的调用上下文能对微信小程序的控制器实现有更深入的了解。

为此我们先要学会微信小程序的调试方法。

打开微信开发者工具，点击工具栏的“调试器”按钮：

开发者工具右边的区域现在从上到下一分为二：上面蓝色区域还是代码编辑页面，下面红色区域就是微信小程序的调试工具。

做过前端开发的朋友们，可以一眼就看出这其实就是Chrome的开发者工具。

在调试器里打开我们的控制器index.js, 单击行号”3”, 然后行号3自动被高亮，说明第3行已经成功设置好了一个断点。

点击“编译”按钮，我们的小程序自动启动，设置在控制器里的断点就自动触发了。这样我们就可以通过单步调试的方式来学习微信小程序控制器的调用上下文了。

微信小程序的调试器在手机上仍然可以打开。在手机上访问微信小程序，点击屏幕右下角的vConsole按钮。

接着整个手机屏幕就被微信小程序的调试器充满了。这个调试器和电脑上安装的微信开发者工具相比，仅仅能显示日志和执行一些简单的JavaScript操作，但是不能像电脑上那样，进行JavaScript代码的调试。