小程序中对es6 promise的应用小记

promise能解决异步多层嵌套回调的尴尬写法，使代码更加容易阅读，我们此次在小程序中就应用promise来包装微信小程序的api。
正常我们在一个页面中使用微信的api比如wx.getLocation

wx.getLocation({ 
  type: 'wgs84', 
  success: function(res) { 
    console.log(res)
  },
  fail: function() {
    console.error("get location failed")
  }
})

现在我们换一种方式，用promise来支持小程序的类似的api，它们都需要传入一个成功或失败的回调函数
1、简单的写一个工具函数在util.js中并暴露出去如下，func作为一个参数传入，如传入wx.getLocation注意这里传入，真正的执行是在promise构造函数中

function wxPromise(func){
  return new Promise(function(resolve,reject){
    func({
      success:function(res){
        resolve(res)
      },
      fail:function(res){
        reject(res)
      }
    })
  })
}
module.exports={
  wxp:wxPromise
}

在真正调用api的页面中引入这个工具函数并传参，then里面的res就是我们promise中resolve的结果，也就是这里执行成功
wx.getLocation获取的位置信息，于是我们想调用的微信的api只要简单包装一下，像这样利用工具函数传递进去，在本页面的then中就可以拿到响应的结果，看起来比刚开始的代码更简化了一些

import util from '../util.js'
util.wxp(wx.getLocation).then(function (res) {
      console.log(res, '获取的地理位置信息')
    })

2、但是此时看起来还是欠一点点，我们把微信的api当做参数传了进去，但是如何给这个api传参呢，就像一开始这样传一个对象参数，里面有type，成功或失败回调函数。

wx.getLocation({ 
  type: 'wgs84', 
  success: function(res) { 
    console.log(res)
  },
  fail: function() {
    console.error("get location failed")
  }
})

想想我们如何将api当做参数传递后再给这个api传参数呢，肯定不能是util.wxp(wx.getLocation（’参数’）)，一旦加了括号就成为立即执行了，这时候我们需要在promise外面包一层函数，在执行wxPromise时先返回一个函数，这个函数用来接收wx.getLocation的参数

function wxPromise(func){
  return function(cs){
    console.log('参数：',cs)

  }
}
module.exports={
  wxp:wxPromise
}
//调用时
util.wxp(wx.getLocation)({type:'wgs84'})

3、因为wx的api都有success、fail等回调方法，所以接收到api的参数后我们统一给他设置一下这些回调，并且把成功或失败的结果resolve或reject抛出,最终完成如下

function wxPromise(func){
  return function(cs){
    console.log('参数',cs)
    return new Promise(function (resolve, reject) {
      cs.success=function(res){
        resolve(res)
      },
      cs.fail=function(res){
        reject(res)
      },
      func(cs)
    })
  }
}
module.exports={
  wxp:wxPromise
}

import util from '../util.js'
util.wxp(wx.getLocation)({type:'wgs84'}).then(function (res) {
      console.log(res, '地理位置信息')
    })