20161123微信小程序学习笔记-js解析

js 是微信小程序的逻辑层，提供了app应该具备的API ，主要逻辑是基于javascript，但是也不完全一样，其中最明显的Alert('')是不可以使用的，只能使用console.log()进行调试；

** 逻辑层分为4个主要部分注册程序，注册页面，模块化，API **

注册程序

App();

注册程序主要执行在App();函数中，并接收一个对象{} ,所有的配置项目都在这里配置；

App({ 
  onLaunch: function() { 
    // Do something initial when launch.
    //当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
  },
   onShow: function() {
     // Do something when show. 
    //当小程序启动，或从后台进入前台显示，会触发 onShow
  }, 
  onHide: function() {
     // Do something when hide. 
    // 当小程序从前台进入后台，会触发 onHide
  }, 
  globalData: 'I am global data'
})

getApp();

我们提供了全局的 getApp()函数，可以获取到小程序实例

var appInstance = getApp()
console.log(appInstance.globalData) 
// I am global data

注册页面

Page

Page()函数用来注册一个页面。接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。

Page({ 
  data: 
  //页面的初始数据
    { text: "This is page data." }, 
  onLoad: function(options) { // Do some initialize when page load. },
   //生命周期函数--监听页面加载
  onReady: function() { // Do something when page ready. }, 
  //生命周期函数--监听页面初次渲染完成
  onShow: function() { // Do something when page show. }, 
  //生命周期函数--监听页面显示
  onHide: function() { // Do something when page hide. }, 
  //生命周期函数--监听页面隐藏
  onUnload: function() { // Do something when page close. },
  //生命周期函数--监听页面卸载 
  onPullDownRefresh: function() { // Do something when pull down. }, 
  //页面相关事件处理函数--监听用户下拉动作
  onReachBottom: function() { // Do something when page reach bottom. },
  //页面上拉触底事件的处理函数 一般用于执行加载程序或loading程序
   // Eventhandler. 
  viewTap: function() { this.setData({ text: 'Set some data for updating view.' }) },
  customData: { hi: 'MINA' }
})

模块化

文件作用域
在 JavaScript 文件中声明的变量和函数只在该文件中有效；不同的文件中可以声明相同名字的变量和函数，不会互相影响。
通过全局函数getApp() 可以获取全局的应用实例，如果需要全局的数据可以在 App()中设置，如：

app.jsApp({ globalData: 1})
// a.js
var app = getApp()
app.globalData++
// b.js
var localValue = 'b'
console.log(getApp().globalData)
//这两个的输出结果是不一样的，是互相不会影响的

模块化
模块只有通过 module.exports或者 exports才能对外暴露接口。
需要注意的是：exports是 module.exports的一个引用不能随便更改
小程序目前不支持直接引入 node_modules

// common.js
function sayHello(name) { console.log(`Hello ${name} !`)}
function sayGoodbye(name) { console.log(`Goodbye ${name} !`)}
module.exports.sayHello = sayHello
exports.sayGoodbye = sayGoodbye

在需要使用这些模块的文件中，使用 require(path)将公共代码引入
*** 这个有点python风格 ***

var common = require('common.js')
Page({ 
  helloMINA: function() { common.sayHello('MINA') }, 
  goodbyeMINA: function() { common.sayGoodbye('MINA') }
})