如何等待所有promise在forEach循環中添加到數組？

Question

我希望我的函數返回諾言數組。 函數內部的代碼是異步的。 我需要檢查每個元素的類型並進行一些處理。 我不知道該函數如何返回所有的諾言-一旦完成異步處理。 的jsfiddle

function addFeatures (input) {

  var result = [];
  input.forEach(function (el) {

    if (Number.isInteger(el)) {
      // placeholder asynchronous
      setTimeout(function () {
        result.push(
          new Promise(function (resolve, reject) {
            resolve(el.toString() + 'string')
          })
        )
      }, 2000);
    } 
    else {
      // placeholder synchronous
      result.push(
        new Promise(function (resolve, reject) {
          resolve(el + 'string')
        }));
    }
  })
  return result;
};

var arr = [1, 'text']
var final = addFeatures(arr)
// should log 2 promises but logs only 1 - the synchronous
console.log(final)

Answer 1

最重要的是要立即創建的承諾，做它里面的東西異步：

function addFeatures (input) {
  var result = [];
  input.forEach(function (el) {
    result.push(new Promise(function (resolve, reject) {
      if (Number.isInteger(el)) {
        // placeholder asynchronous
        setTimeout(function () {
          resolve(el.toString() + 'string')
        }, 2000);
      } else {
        // placeholder synchronous
        resolve(el + 'string')
      }
    });
  });
  return result;
}

我還建議使用map而不是forEach + push 。

Answer 2

基於貝爾吉的出色回答，這是我的貢獻：

1-函數addFeatures與array.map ：

function addFeatures (input) {
    return input.map(function(el) {
        return new Promise(function (resolve, reject) {
            if (Number.isInteger(el)) {
                setTimeout(resolve, 2000, el.toString() + 'string');
                /* setTimeout(reject, 2000, el.toString() + 'string'); //for reject */
            }
            else {
                resolve(el + 'string');
                /* reject(el + 'string'); //for reject */
            }
        })
    });
};

2-測試addFeatures結果的addFeatures 。

如果您不能正確地管理以上代碼的答案， 有時 asynchronous placeholder promise的resolve將變為pending並返回undefined 。 這就是為什么您需要Promise.all的原因：

function foo(){
    return Promise.all(addFeatures([1, 'text'])).then(values => {
        return values;
    }, function() {
        throw 'Promise Rejected';
    });
}

3-在上面調用您的函數

foo().then(function(result) {
    console.log("result => " + result);
}).catch(function(error) {
    console.log("error => " + error);
});

小提琴