For循環內沒有完成Promise

我正試圖編寫一個函數，其中包括一個for循環內的Promise，但循環只在迭代執行，並且承諾永遠不會解決。For循環內沒有完成Promise

我的代碼如下所示：

function appendPosts() { 
    return functionThatReturnsAPromise() 
     .then(result => { 
      return new Promise((resolve, reject) => { 
       var list = []; 
       result.forEach(item => { 
       //do stuff to item 
       list.push(item); 
       }); 
      resolve(list); 
      }); 
     }) 
     .then(list => { 
      return new Promise((resolve, reject) => { 
      //This loop only runs once, even when list has contains many items 
      for (var i = 0; i < list.length; i++) { 
      document.querySelector("someSelector").appendChild(list[i]); 
      } 
      resolve(); 
     }); 
    }); 
}

顯然，我做錯了什麼。有任何想法嗎？

謝謝你的時間。 - 丹尼爾

來源

2017-06-03 Daniel Bernhard

'.then（）'中'Promise'構造函數的目的是什麼？爲什麼迭代'result'只是爲了將'item'推送到數組？ – guest271314

我不認爲當列表長度更長時，for循環只能運行一次。再次檢查迭代和list.length。 – xDreamCoding

也許第一次迭代發生異常？使用['catch']（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/catch）。 –

@MaazSyedAdeeb是正確的。循環中出現了一個異常，我沒有一個catch塊。謝謝。

來源

2017-06-04 15:40:04

選擇器可能沒有返回匹配，因此appendChild在undefined上被調用，觸發異常轉換爲被拒絕的承諾。

如果你打電話給你增加一個.catch你可以把這個錯誤：

appendPosts().then(function() { 
    console.log('all done'); 
}).catch(function (err) { 
    console.log('error occurred: ', err); 
});

但是，你正在使用的promise constructor anti-pattern也應該被提及。也就是說，在then回調函數中，您可以返回一個值，該值將成爲then將返回的承諾的承諾值。所以不需要做new Promise()。相反，這樣做：

function appendPosts() { 
    return functionThatReturnsAPromise().then(result => { 
     // Just return the mapped array: 
     return result.map(item => { 
      //do stuff to item 
      return item; 
     }).then(list => { 
      for (var i = 0; i < list.length; i++) { 
       // Make sure the selector will result in a match: 
       document.querySelector("someSelector").appendChild(list[i]); 
      } 
     }); 
    }); 
}

來源

2017-06-04 21:32:05 trincot

For循環內沒有完成Promise

回答

相關問題