本文为菜鸟窝编辑吴佳林的连载。
在 微信小程序入门（三）中，我们主要学习了开发者工具介绍以及项目的结构，本篇文章就主要介绍微信小程序的模块化以及page函数。
一. 模块化
如果学过Android的，应该对模块不陌生，我们通常会把一些业务功能抽取成独立的一个模块，然后根据业务模块进行分组开发。微信小程序也有模块化的概念，但是微信小程序的对模块化定义有些不同，官方文档对模块的定义是：
"我们可以将一些公共的代码抽离成为一个单独的 js 文件，作为一个模块。"
也就是将公共代码进行封装起来，避免重复代码，可以重复调用。
微信小程序的模块化机制跟JavaScript的模块化机制非常相似，都是通过module.exports暴露对象，然后再通过通过require来获取对象。下面来了解一下微信小程序的模块化开发。
1.定义一个在页面定义个公共方法：比如在utils包创建一个common.js，然后在里面定义方法
function printHello(){
console.log("first printHello");
}
2.通过 module.exports 暴露模块接口
module.exports={
printHello:printHello
};
3.在其它模块通过 require(path) 进行引用模块，然后调用方法
//引入comm.js文件
var comm=require('../../utils/common.js')
//在onLoad方法进行调用
onLoad: function () {
comm.printHello();
}
4.编译后就可以在调试界面看到输出的文字了。
好了，经过上面几步，我们的模块化开发就完成了。
二. page函数
在每个js文件里面，都一个固定函数 page() ,这个函数主要作用是用来注册一个页面，接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。示例如下：
Page({
data:{
},
onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
},
onReady:function(){
// 页面渲染完成
},
onShow:function(){
// 页面显示
},
onHide:function(){
// 页面隐藏
},
onUnload:function(){
// 页面关闭
}
})
-
初始化数据：
data:初始化页面数据 -
生命周期函数
onLoad: 监听页面加载，一个页面只会调用一次onReady: 监听页面初次渲染完成，一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互onShow: 监听页面显示，每次打开页面都会调用一次onHide: 监听页面隐藏，页面隐藏的时候调用onUnload: 监听页面卸载，页面卸载的时候调用 -
事件处理
onPullDownRefresh: 监听用户下拉动作，需要在config的window选项中开启enablePullDownRefreshonReachBottom: 页面上拉触底事件的处理函数，需要在config的window选项中开启enablePullDownRefreshonShareAppMessage: 用户点击右上角分享 -
自定义
可以添加任意的函数或数据到 object 参数中，在页面的函数中用 this 可以访问
关于data,这里要说个两个点
-
如何在wxml使用data里面初始化的值。
在js文件的data参数定义相关 key-value 的值后，在wxml文件加上
{{key}}就可以使用data里面的值了。示例代码：
在js文件以及在wxml定义：
Page({
data: {
text: 'init data',
array: [{text: 'init data'}],
object: {
text: 'init data'
}
}......
<view>{{text}}</view>
<view>{{array[0].text}}</view>
<view>{{object.text}}</view>
```
2. 如何在其他函数修改初始化data里面的值
在函数里面使用setData() ，以 key，value 的形式表示将 this.data 中的 key 对应的值改变成 value。
示例代码：
Page({
data: {
text: 'init data',
array: [{text: 'init data'}],
object: {
text: 'init data'
}
},
changeText: function() {
this.setData({
text: 'changed data'
})
}
###三.总结
看完这篇文章，模块化理解起来不是很难，至于page函数，是微信小程序中一个很关键的点，因为里面涉及了初始化数据，生命周期等函数，特别是生命周期，我们在之后的文章也是会专门讲生命周期这个点。
>更多内容，请关注菜鸟窝（微信公众号ID: cniao5），程序猿的在线学习平台。 转载请注明出处，本文出自菜鸟窝，原文链接http://www.cniao5.com/forum/thread/3b9a922611e511e7b98900163e0230fa