在for循環中解析數組undefined後未定義數組

Question

我有一個未定義的數組，它在得到填充的for循環後得到解決的問題。它看起來像如下：

function mainFunction() { 
    getUnreadMails().then(function(mailArray) { 
     // Do stuff with the mailArray 
     // Here it is undefined 
    }) 
} 

function getUnreadMails() { 
    var mailArray = []; 
    return new Promise(function(resolve, reject) { 

     listMessages(oauth2Client).then(
      (messageIDs) => { 

       for(var i = 0; i < messageIDs.length; i++) { 
        getMessage(oauth2Client, 'me', messageIDs[i]).then(function(r) { 
         // Array gets filled 
         mailArray.push(r); 
        }, function(error) { 
         reject(error); 
        }) 
       } 
       // Array gets resolved 
       resolve(mailArray); 
      }, 
      (error) => { 
       reject(error); 
      } 
     ) 
    }); 
} 

兩個listMessages()和getMessage()返回一個承諾，所以在這裏鏈。任何想法，爲什麼我得到一個undefined mailArray？我的猜測是，它在解決問題時還沒有填充。其次，我認爲這個流程不是一個好的做法。

Answer 1

的陣列可能是undefined因爲它從未被定義;至少在你的代碼中沒有。你的承諾在你的循環中的任何迭代可以解決或更好地說，拋出（試圖push未定義）之前解決。

除此之外。您可以使用Array#map和Promise.all高度簡化代碼。

並且捕獲一個錯誤沒有意義，只是爲了重新拋出相同的錯誤而不做任何其他的操作。

function getUnreadMails() { 
    //put this on a seperate line for readability 
    //converts a single messageId into a Promise of the result 
    const id2message = id => getMessage(oauth2Client, 'me', id); 

    return listMessages(oauth2Client) 
     //converts the resolved messageId into an Array of Promises 
     .then(messageIDs => messageIDs.map(id2message)) 
     //converts the Array of Promises into an Promise of an Array 
     //.then(Promise.all.bind(Promise)); 
     .then(promises => Promise.all(promises)); 
    //returns a Promise that resolves to that Array of values 
} 

或短：

function getUnreadMails() { 
    return listMessages(oauth2Client) 
     .then(messageIDs => Promise.all(messageIDs.map(id => getMessage(oauth2Client, 'me', id)))) 
} 

。然後（Promise.all）將行不通

我想使中間結果更加清晰由它們分隔條件爲不同步驟/功能。但是我輸入得太快而沒有檢查。修復了代碼。

在短版，在那裏做了mailArray後來竟得到填補/解決

Promise.all()需要一個承諾的數組，並返回解析值的一個承諾（或第一拒絕） 。

messageIDs.map(...)返回一個數組及其周圍的Promise.all（）將其轉換爲解析值的單個Promise。 而且由於我們在Promise鏈中返回了這個Promise，返回的承諾（listMessages(oauth2Client).then(...)）也解析爲這個值的數組。

Answer 2

  getMessage(oauth2Client, 'me', messageIDs[i]).then(function(r) { 
        // Array gets filled 
        mailArray.push(r); 
       }, function(error) { 
        reject(error); 
       }) 

是一個異步調用

resolve(mailArray); 

不會等待它推送數據，並會解決的手前陣

到甲階酚醛這個你應該使用Promise.all（）

function mainFunction() { 
    getUnreadMails().then(function(mailArray) { 
     // Do stuff with the mailArray 
     // Here it is undefined 
    }) 
} 

function getUnreadMails() { 
    var mailArray = []; 

    return listMessages(oauth2Client).then(
     (messageIDs) => { 

      for(var i = 0; i < messageIDs.length; i++) { 
       mailArray.push(getMessage(oauth2Client, 'me', messageIDs[i])); 
      } 
      // Array gets resolved 
      return Promise.all(mailArray); 
     }, 
     (error) => { 
      reject(error); 
     } 
     ) 
} 

Answer 3

剛剛接過marvel308的答案，我認爲你需要創建一個新的Promise可以解決你的其他問題。我還沒有機會測試這一點，但我認爲這應該工作

function getUnreadMails() { 

    var mailArray = []; 

    return new Promise(function(resolve, reject) { 

     listMessages(oauth2Client).then(
      (messageIDs) => { 

       var messages = []; 

       for(var i = 0; i < messageIDs.length; i++) { 
        messages.push(
         getMessage(oauth2Client, 'me', messageIDs[i]).catch(reject) 
        ); 
       } 

       Promise.all(messages).then(resolve); 

      }, 
      (error) => { 
       reject(error); 
      } 
     ) 
    }); 

} 

這樣，你的第一個應許的resolve被調用時，所有的messages已經解決

Answer 4

Explicit construction is an anti-pattern

我相信你可以寫一段代碼更短，恕我直言，清潔

function mainFunction() { 
    getUnreadMails().then(function(mailArray) { 
    // Do stuff with the mailArray 
    // Here it is undefined 
    }) 
} 

function getUnreadMails() { 
    return listMessages(oauth2Client) 
     .then((messageIDs) => Promise.all(messageIDs.map(id => getMessage(oauth2Client, 'me', id))) 

} 

Answer 5

由於您getMessage功能是異步，以及你需要等到所有呼叫完成。

我會建議使用Promise.all

在這裏你可以找到更多的信息：MDN Promise.all()

的代碼會是這個樣子：

messageIDs.map(...)返回Promises

使用Promise.all()數組獲得所有承諾響應的陣列

resolve如果值是正確的，否則reject

function mainFunction() { 
     getUnreadMails().then(function(mailArray) { 
     // Do stuff with the mailArray 
     // Here it is undefined 
     }) 
    } 

    function getUnreadMails() { 
    return new Promise(function(resolve, reject) { 
     listMessages(oauth2Client).then(
      (messageIDs) => { 
       return Promise.all(messageIDs.map(id => getMessage(oauth2Client, 'me', id))) 
     }) 
     .then((messages) => resolve(messages)) 
     .catch(error => reject(error)) 
    }); 
} 

有一點要記住的是，Promise.all()拒絕您的任何承諾未能

希望這有助於！