.js:页面逻辑文件

页面逻辑文件主要功能有：设置初始化数据，注册当前页面生命周期，注册事件处理函数等。小程序的逻辑文件是JavaScript文件，所有的逻辑文件，包括app.js，最终将会打包成一个js文件，在小程序启动时运行，直到小程序的销毁，类似于ServiceWorker，所以逻辑层也称为App Service。
在小程序中，每个逻辑文件都有独立的作用域，并具备模块化能力。每个小程序都需要在 app.js 中调用 App 方法注册小程序实例，绑定生命周期回调函数、错误监听和页面不存在监听函数等。

1、注册页面

在逻辑文件中需要通过构造器注册页面。指定页面的初始数据、生命周期函数、事件处理函数等。

使用 Page 构造器注册页面

简单的页面可以使用 Page （）函数注册页面。
属性：
data：类型Object，页面初始数据，数据必须是可转成JSON格式的对象类型。当页面第一次渲染时，data会以JSON的形式由逻辑层传至渲染层，渲染层可通过WXML进行数据绑定。
onLaunch:类型function，生命周期函数，页面加载时触发。启动时初始化，一个页面只会调用一次，接受页面参数
onShow:类型function，生命周期函数，页面显示时触发。从后台唤醒，切换到前台；每次打开页面都会调用一次。
onHide：类型function，生命周期函数，页面初次渲染时触发。切换到后台。
onUnload：类型function，生命周期函数，页面卸载时触发。关闭当前页面。
onPullDownRefresh：类型function，页面相关时间处理函数，用户下拉时触发。使用时需要将app.json配置中window的enablePullDownRefresh属性设置为true。当处理完数据刷新后，可以调用wx.stopPullDownRefresh方法停止当前页面下拉刷新。
onReachBottom：类型 function，页面上拉触底事件的处理函数。
onShareAppMessage ：类型function ， 用户点击右上角转发。
onPageScroll：类型 function，页面滚动触发事件的处理函数。
onResize ：类型function ，页面尺寸改变时触发，详见 响应显示区域变化。
onTabItemTap ：类型function，当前是 tab 页时，点击 tab 时触发。
示例代码：

Page({
  data: {
    text: "This is page data."
  },
  onLoad: function(options) {
    // 页面创建时执行
  },
  onShow: function() {
    // 页面出现在前台时执行
  },
  onReady: function() {
    // 页面首次渲染完毕时执行
  },
  onHide: function() {
    // 页面从前台变为后台时执行
  },
  onUnload: function() {
    // 页面销毁时执行
  },
  onPullDownRefresh: function() {
    // 触发下拉刷新时执行
  },
  onReachBottom: function() {
    // 页面触底时执行
  },
  onShareAppMessage: function () {
    // 页面被用户分享时执行
  },
  onPageScroll: function() {
    // 页面滚动时执行
  },
  onResize: function() {
    // 页面尺寸变化时执行
  },
  onTabItemTap(item) {
    // tab 点击时执行
    console.log(item.index)
    console.log(item.pagePath)
    console.log(item.text)
  },
  // 事件响应函数
  viewTap: function() {
    this.setData({
      text: 'Set some data for updating view.'
    }, function() {
      // this is setData callback
    })
  },
  // 自由数据
  customData: {
    hi: 'MINA'
  }
})

小程序框架以栈的形式维护了当前所有页面，当发生路由切换时，页面栈和生命周期函数关系如下：
小程序初始化：默认页面入栈，依次触发默认页面onLoad、onShow、onReady方法。
**打开新页面：**新页面入栈，依次触发新页面onLoad、onShow、onReady方法。
页面重定向：当前页面出栈并卸载，触发当前弹出页面onUnload方法，直到返回目标页面，新页面入栈，触发新页面onShow方法。
Tab切换：当前页面出栈但不卸载，仅触发onHide方法，新页面入栈，如果当前页面是新加载的，触发onLoad、onShow、onReady方法。如果当前页面已经加载过，仅触发onShow方法。
程序从前台到后台：触发当前页面onHide方法，触发App onHide方法。
程序从后台到前台：触发小程序onShow方法，触发页面onShow方法。
整体来说，如果页面在生命周期，只会触发onShow和onLoad方法，只有加载和卸载时才会触发onLoad、onReady和onUnload方法。而触发页面卸载只有页面返回和页面重定向操作。

在页面中使用 behaviors

基础库 2.9.2 开始支持，低版本需做兼容处理。

页面可以引用 behaviors 。 behaviors 可以用来让多个页面有相同的数据字段和方法。
注册一个 behavior，接受一个 Object 类型的参数。

参数
Object object

定义段	类型	是否必填	描述
properties	Object Map	否	同组件的属性
data	Object	否	同组件的数据
methods	Object	否	同自定义组件的方法
behaviors	String Array	否	引入其它的 behavior
created	Function	否	生命周期函数
attached	Function	否	生命周期函数
ready	Function	否	生命周期函数
moved	Function	否	生命周期函数
detached	Function	否	生命周期函数

代码示例：

// my-behavior.js
module.exports = Behavior({
  behaviors: [],
  properties: {
    myBehaviorProperty: {
      type: String
    }
  },
  data: {
    myBehaviorData: {}
  },
  attached: function(){},
  methods: {
    myBehaviorMethod: function(){}
  }
})

使用 Component 构造器构造页面

基础库 1.6.3 开始支持，低版本需做兼容处理。

Page 构造器适用于简单的页面。但对于复杂的页面， Page 构造器可能并不好用。

定义段	类型	是否必填	描述
properties	Object Map	否	组件的对外属性，是属性名到属性设置的映射表
data	Object	否	组件的内部数据，和 properties 一同用于组件的模板渲染
observers	Object	否	组件数据字段监听器，用于监听 properties 和 data 的变化，参见 数据监听器 最低版本2.6.1
method	Object	否	组件的方法，包括事件响应函数和任意的自定义方法，关于事件响应函数的使用，参见 组件间通信与事件
behaviors	String Array	否	类似于mixins和traits的组件间代码复用机制
created	Function	否	组件生命周期函数-在组件实例刚刚被创建时执行，注意此时不能调用 setData )
attached	Function	否	组件生命周期函数-在组件实例进入页面节点树时执行)
ready	Function	否	组件生命周期函数-在组件布局完成后执行)
moved	Function	否	组件生命周期函数-在组件实例被移动到节点树另一个位置时执行)
detached	Function	否	组件生命周期函数-在组件实例被从页面节点树移除时执行)
relations	Object	否	组件间关系定义，参见 组件间关系
externalClasses	String Array	否	组件接受的外部样式类，参见 外部样式类
options	Object Map	否	一些选项（文档中介绍相关特性时会涉及具体的选项设置，这里暂不列举）
lifetimes	Object	否	组件生命周期声明对象，参见 组件生命周期 最低版本2.2.3
pageLifetimes	Object	否	组件所在页面的生命周期声明对象，参见 组件生命周期 最低版本2.2.3
definitionFilter	Function	否	定义段过滤器，用于自定义组件扩展，参见 自定义组件扩展 最低版本2.2.3

此时，可以使用 Component 构造器来构造页面。 Component 构造器的主要区别是：方法需要放在 methods: { } 里面。

代码示例：

Component({
  data: {
    text: "This is page data."
  },
  methods: {
    onLoad: function(options) {
      // 页面创建时执行
    },
    onPullDownRefresh: function() {
      // 下拉刷新时执行
    },
    // 事件响应函数
    viewTap: function() {
      // ...
    }
  }
})

这种创建方式非常类似于 自定义组件 ，可以像自定义组件一样使用 behaviors 等高级特性。

2、获取当前页面出栈（getCurrentPages()）

有注册就有获取getCurrentPages()函数便是用于获取当前页面栈的实例。获取当前页面栈。页面栈以数组形式按栈顺序给出。数组中第一个元素为首页，最后一个元素为当前页面。

/* 获取页面栈 */
var pages=getCurrentPages（）；
/* 获取当前页面对象 */
var currentPage=pages[pages.length-1]

注意：

不要尝试修改页面栈，会导致路由以及页面状态错误。
不要在 App.onLaunch 的时候调用 getCurrentPages()，此时 page 还没有生成。

3、事件处理函数

页面对象注册的函数可以和视图层的组件进行绑定，当达到触发条件时，就会执行Page中定义的响应事件，这类自定义函数统称为事件处理函数。小程序中的组件的事件分为特殊事件和通用事件

4、触发视图层渲染

页面首次加载时，框架会结合初始化数据渲染页面，在逻辑层则需要主动调用Page.prototype.setDate（）方法，而不能直接修改page的data值。这样不仅无法触发视图层渲染，还会造成数据不一致。当Page.prototype.setData（）被调用时，会将数据从逻辑层发送到视图层重绘，同时修改Page中data的值。setData（）接受一个Object对象参数，方法会自动将this.data中的key对应值变成Object参数中key对应值。当他们一致时，将不会触发渲染层渲染。在项目中，我们一定要保证视图层与逻辑层的数据一致。
Object参数的key值非常灵活，可以按照数据路径形式给出，如array[5].info、obj.key.subkey，并且这样使用时，不需要在this.data中预先定义。