0基础学习微信小程序(9)-C++程序员眼中的app.js

面向对象思考2019-06-05 08:06:19

点击上方【面向对象思考】可快速关注本公众号!


又是周一,开工的日子。终于到了说明真正的程序的部分。


作为程序员来讲,似乎只有看到了能动的代码才会安心。但是这里的程序是Javascript,C或者C++程序员看起来会比较陌生。


作者一边查,一边理解,一边尽量详细的说明。如果有说错的地方,敬请指正。


对象字面量表示法


这部分的说明直接引用自【JavaScript高级程序设计,第五章】。


在Javascript中创建Object实例的方式有两种。第一种是使用new操作符后跟Object构造函数,如下所示:


var person = new Object();

persion.name = "Nicholas";

persion.age = 29;


另一种方法是使用对象字面量表示法,对象字面量是对象定义的一种简写形式,目的在于简化创建包含大量属性的对象的过程。下面这个例子就使用了对象字面量语法定义了与前面那个例子中相同的person对象。


var person = {

    name : "Nicholas",

    age : 29

};


第一种C/C++程序员熟悉的方式,而对象字面量表示法就比较陌生了。当然这只是形式上的不同,内容是一样的。稍加适应即可。


代码


//app.js
App({

    onLaunch: function() {
        //调用API从本地缓存中获取数据
        var logs = wx.getStorageSync('logs') || []
        logs.unshift(Date.now())
        wx.setStorageSync('logs', logs)
    },

    getUserInfo: function(cb) {
        var that = this
        if (this.globalData.userInfo) {
            typeof cb == "function" && cb(this.globalData.userInfo)
         } else {
             //调用登录接口
             wx.getUserInfo({
                 withCredentials: false,
                 success: function(res) {
                     that.globalData.userInfo = res.userInfo
                     typeof cb == "function" && cb(that.globalData.userInfo)
                 }
             })
         }
    },
 
    globalData: {
        userInfo: null
    }
})


参数对象


这段代码的最外层是App()函数,它用来注册小程序。这个函数接受一个 object对象参数,它指定的是小程序的生命周期函数等。这个对象的边界就是App第一个“(”后面的“{”到最后一个小括号前面的“}”。它的内部又包含了onLaunch函数对象,getUserInfo函数对象和globalData数据对象。


需要注意的是,函数对象也好,数据对象也好,都只是被注册到架构中,至于调用/使用的时机,相信另有安排。


onLauch函数对象


当小程序初始化完成时,会触发 onLaunch(全局只触发一次),在本例中,onLaunch首先从数据缓存中取得logs数组,如果取得失败则通过“|| [ ]“”创建新数组。在数组中增加当前日期(和时间)之后,将数组重新保存在数据缓存中。


程序员不要自己调用这个函数。


getInfo函数对象


如果是第一次调用这个函数则首先调用登录接口取得用户信息,如果不是第一次调用,则直接返回已经取得的用户信息。


取得用户信息的wx.getUserInfo函数也要稍微说明一下:它是由小程序架构提供的API,仍然是一个对象。这个参数对象又包含了withCredentials属性和另外的success函数对象。其中success函数会在getUserInfo成功时被调用以接收用户信息。


用C语言的观点来讲,这就是一个回调函数。


globalData数据对象


简单的定义了userinfo数据对象。


参考资料


对象字面量表示法


JavaScript高级程序设计,第五章


微信逻辑层


https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/


小程序API


https://mp.weixin.qq.com/debug/wxadoc/dev/api/


写在文章的最后


既然已经读到这里了,拜托大家再用一分钟时间,将文章转发到各位的朋友圈,微信群中。本公众号的成长需要您的支持!


本日关注数:534 休息日也涨粉!