小程序同步异步

最近一段时间写微信小程序大家或许注意到了有些时候在登录的时候莫名其妙的报错了,然后就开始一路找bug之路,每次console.log都没问题都有数据啊,但是就是报错,这时候用断点调试法发现,上一步的函数体还没有执行完毕呢,下一个函数就开始执行了,但是呢下一步的函数还必须需要上一步返回的参数不可,百度了一下才知道那是因为微信小程序是异步执行的,两个函数同时执行谁也不等谁,这里如果有兄弟不明白同步和异步的话可以百度一下就知道了,这时候必须要使用javascript的函数Promise,但是呢微信小程序增加ES6的promise特性支，微信小程序新版本中移除了promise的支持，需要自己使用第三方库来自行实现ES6的promise特性,网上有第三方自己造的轮子,但是我用了以后我就后悔了,真的是一脸懵懂啊,想了想算了,快算了自己想个办法吧

asyncFunc1(function(){
  //...
  asyncFunc2(function(){
    //...
    asyncFunc3(function(){
      //...
      asyncFunc4(function(){
        //...
        asyncFunc5(function(){
           //...
        });
      });
    });
  });
});

上面的代码应该是你想要的执行顺序吧,但是感觉太难看了,所以我想了一个笨办法,什么话都没有上代码

 // 这是app.js的getUserInfo方法
    getUserInfo: function(cb) 
    {
        var that = this
        if(this.globalData.userInfo)
        {
            typeof cb == "function" && cb(this.globalData.userInfo)
        }else 
        {
            // 调用登录接口
            wx.login({
                success: function(res) 
                {
                    // 登录成功
                    if (res.code) 
                    {
                        var code = res.code;
                        wx.getUserInfo({
                            success: function(res2)
                            {
                                that.globalData.userInfo = res2.userInfo
                                typeof cb == "function" && cb(that.globalData.userInfo)
                                var username = res2.userInfo.nickName
                                var img = res2.userInfo.avatarUrl
                                // 请求自己的服务器
                                wx.request({
                                    // 自己的服务接口地址
                                    url    : '自己的服务接口地址',
                                    method : 'POST',
                                    header : {'content-type':'application/x-www-form-urlencoded'},
                                    data   : {encryptedData: res2.encryptedData, iv: res2.iv, code: code},
                                    success: function (res) 
                                    {
                                        console.log(res)
                                        // 4.解密成功后 获取自己服务器返回的结果
                                        if(res.data.code == '200') 
                                        {
                                            wx.setStorageSync('user[app_key]', res.data.result.app_key)
                                            wx.setStorageSync('user[app_token]', res.data.result.app_token)
                                            wx.setStorageSync('user[paperTypeId]', '201607301639232601224301')
                                        }else 
                                        {
                                            wx.showLoading({
                                                title: '网络错误',
                                                mask:true
                                            })
                                        }
                                    },
                                    fail:function(res)
                                    {
                                        wx.showLoading({
                                            title: '系统内部错误',
                                            mask:true
                                        })
                                    }
                                })
                            }
                        })
                    }else 
                    {
                        wx.showModal({
                            title: '提示',
                            content: '获取用户登录态失败！'+res.errMsg
                        })
                    }
                }
            })
        }
    }

    // 这是index.js的内容
    onload
    {
        wx.showLoading({
            title: '加载中',
            mask:true
        })
        // 在这里原本我是打算app.getUserInfo(function(){这里是我的下一步的request请求但是还是不行})
        // 因为我需要登录后的用户信息,但是app.getUserInfo和下面的request请求基本上是同时请求的所以获取不到
        app.getUserInfo()
        var that = this
        // 在这里我设置了一个定时器循环多次去执行去判断上一步的函数执行完毕没有
        // 但是也不能无限循环,所以要叫一个判断当执行超过多少秒后报一个网络错误
        var times = setInterval(function()
        {
            // 因为一开始缓存当中指定的key为假当为真的时候就说明上一步成功了这时候就可以开始发送下一步的请求了
            var search = wx.getStorageSync('user[app_key]')
            if(search)
            {
                var app_key     = wx.getStorageSync('user[app_key]')    // 用户名
                var app_token   = wx.getStorageSync('user[app_token]')  // 用户token
                var paperTypeId = wx.getStorageSync('user[paperTypeId]')// 考试类型
                var ptype       = wx.getStorageSync('ptype')
                wx.request({
                    url: '这是你服务器的网址',
                    data: 
                    {
                        app_key     : app_key,
                        app_token   : app_token,
                        paperTypeId : paperTypeId,
                        examId      : '201607271938505071233880'
                    },
                    method: 'GET',
                    header: {'content-type': 'application/json'},
                    success: function(res)
                    {   
                        if(res.data.status === '200')
                        {
                            that.setData({
                                items:res.data.result
                            })
                            // 在这里停止加载的提示框
                            setTimeout(function(){
                                wx.hideLoading()
                            },1000)
                            // 这里必须要清除不然就等着循环死吧
                            clearTimeout(times);
                        }else
                        {
                            console.log('服务器内部错误')
                        }
                    }
                })
            }
        }
    }