異步結果做爲函數返回值

• 把異步結果做爲函數返回值。
  • 一般，一個函數若是要把異步結果（請求返回值、定時器結果等）做爲這個函數的返回值，就須要回調函數。若是不用回調函數，在異步結束的時候直接return，那麼調用這個函數的時候，函數的真正返回值會是undefined。例如函數a以下：

  this.$models.a('xxx').then(res=>{
          if(res.status.retcode === 0){
              return res.data
  }})
  複製代碼

  • 調用函數a()，let result = a()，獲得的值是undefined，由於請求是異步的，在獲取到請求結果以前已經return了。

  • 傳統方式就是給a傳一個回調函數，在回調函數裏處理其餘業務邏輯，即

    • 調用：a(cb(....))
    • a的實現：

    this.$models.a('xxx', data).then(res=>{
        if(res.status.retcode === 0){
            if(cb) cb()
    }})
    複製代碼

  • 有了Promise以後，能夠新建一個Promise函數，獲得一個返回值，

    • a：

    a() {
    // 其實$models返回的就是一個Promise，也能夠直接return this.$models...，可是爲了舉例子方便，再也不修改。
        return new Promise(resolve => {
            this.$models.a('xxx').then(res=>{
                if(res.status.retcode === 0){
                    resolve(res.data)
                } else {
                    resolve([])
                }
            })
        })
    }
    複製代碼

    • 調用：此時 a()是一個Promise對象，須要使用then()方法接收處理以後的值：

    a().then(data => {
        console.log(data) // 這個data就是resolve以後的數據
    })
    複製代碼

  • 要實現相似的功能，還能夠選擇generator或者async，省去generator不談，記錄一下async的實現方法。

    • a：

    a() {
        return new Promise(resolve => {
            this.$models.a('xxx').then(res=>{
                if(res.status.retcode === 0){
                    resolve(res.data)
                } else {
                    resolve([])
                }
            })
        })
    }
    複製代碼

    • 調用：用一個async函數來接收a，而後調用這個函數便可

    async function b() {
        let data = await a();
        console.log(data)
        ....
    }
    b()
    複製代碼