新手尝试编写微信小程序（3）——我的第一个微信小程序

前两篇博文已经把可以通过简单就能体现出效果的“玩点”都玩了一遍。玩过了简单的这些玩点，并不能登大雅之堂，咱们还是要静下心来，仔细看看微信小程序的框架结构以及运行原理。那么，我们这篇博文就 来一起探索一下微信小程序的框架构成。在微信小程序的开发文档中，框架结构的内容应该就是文档中的“配置”部分了。

一、框架与配置
1、配置数据存储
不仅对于小程序而言，需要配置一个整体的小程序配置（存储在app.json文件中），而且对于每个页面都需要一个配置，所以我们才看到，几乎每个页面都有一个json文件来存储该页面的配置数据。

2、配置数据的含义
我们可以看到，APP的配置数据中有两个章节，第一个就是pages，第二是window，而且两个章节里面的内容和格式都不相同。
pages
我们可以看出pages存储的是路径，严格的说是页面路径，也就是说我们建立了多少个页面，都要在这里备案一次（不过这个路径和文件路径不一样，不需要写出文件的扩展名）,否则我们的程序恐怕就找不到我们的页面在哪里了。
把这些路径写在这里的另一个作用就是确定这些页面的启动顺序，一般放在一条的就是默认的启动首页，这里我们可以自己动手测试一下，看看，把logs放在第一行是否会首先启动日志页面。

window
这里的window章节里描述的都是一些文字样式、导航栏的背景色、导航栏标题及标题的颜色。实际上我们已经看到了，这也是非常容易修改的。
值得我们注意的是：一旦我们修改了，那么这些内容就会在每个页面都起作用，而不是某一个页面，正因如此，它就是全app的配置，所以放在了app.json中。

我们修改一下，我们修改了标题和标题的背景色，看看效果：

二、运行与加载
运行加载方面的内容，在微信小程序的开发文档里对应的内容应该叫做程序的生命周期，叫做什么不重要，重要的是知道这些东东是用来描述什么或者说用来干什么。
和前面的配置框架一样，不仅仅有一个app的运行加载控制，每个页面都有自己的程序运行加载控制，他们的名字都叫做js。
1、app.js
我们在这个js中可以看到，开头的位置第一行为App({})函数，这个函数的实现是一个App不可缺少的，否则整个小程序就无法运行，按照微信官方的说法这个App函数为小程序的构造函数，后面在页面调用的时候就要依靠它来实例化小程序，也就是说，我们任何人设计的小程序都好比一个类（这个App就是这个类的构造函数），而我们运行的小程序为仅仅是我们设计的小程序的一个实例。如下图：

通过上面的图，我们可以看到，整个这个文件其实就一个函数App({})，上图红色箭头所指的是这个函数的开头和结尾。

值得特别提出的是App函数内部的Onlunch函数（实际按照官方的说法它是App函数的一个object参数），很显然，它是在小程序运行启动时被执行且只执行依次，也就是说要为小程序所做的“准备工作”都可以放在这里运行，也就是说，我们没有什么需要运行的也可以完全让它置空，什么也不写。

我们的“第一个小程序”在建立的时候开发工具自动给小程序做了一个登陆日志记录和一个登陆及获取用户信息的动作，所以我们可以看到OnLuanch中有三部分：
第一部分为日志记录存储

第二部分为登陆

第三部分为获取用户信息

其中，用户登陆及用户信息我们会在index页中用到。

2、页面js

和程序构造函数一样，我们的页面每个页面都有一个构造器，所以我们会在每个页面(index.js)的js函数中首先看到Page({}),函数中所有的设计都会在页面实例化的时候被运行，这里我们也可以发现一个函数Onload的函数，它和App函数中的OnLuanch作用几乎一模一样仅仅在页面加载的时候被执行。我们看看：

上图中是index.js的代码，我们可以清晰的看到Page构造函数和一个Onload函数。
这里要特别提出三点：
1、Page函数前的getApp，这个就是我们前面在App.js中的App（{}）的一个实例；
2、Page函数的开头部分以data：{}包含的几个类似变量声明的部分，实际是Jason格式的数据，专门提供给page使用（这个hello world我们可以随意改动的，前面我们试过了）
3、OnLoad中我们开始调用getApp获得的实例app，从而可以通过它来获得小程序的全局数据，如通过小程序API获得的用户信息等；

三、页面样式
实际页面样式的控制分布在json文件和wxss中，都是描述性的语言，如果没有html基础的，可以仔细去看看这方面的课程，比较简单，如果有html基础的就课略过。

总结：
到这里为止，我们基本已经了解小程序的基本结构了以及运行机制，至于具体某个函数的详细用法和详细说明可以参考官网的开发文档。
但到目前为止我们的这个程序应该只能说是一个“摆设”，我们不可能去对外发布这么一个程序，因为他没有任何业务，没有任何应用价值。那么，后面我们准备探索小程序在业务方面的实际应用。有兴趣的童鞋继续关注！