等待多个 for-each 语句完成

Question

我有一个集群数组，其中每个集群都包含一组特征。我使用两个 forEach 语句来遍历集群和特征，以便将每个特征存储在我的“结果”数组中。

我需要进一步处理我的“结果”数组。但是当我询问数组的长度时，它说长度为 0，尽管我可以在控制台中看到其中有一些特性。我需要找到一种仅在 forEach 循环完成时处理“结果”数组的方法。

我已经读到这个问题是由 JavaScript 中的异步数据处理引起的。我已经尝试注册一个 Promise，但我无法让它工作，因为在示例中总是使用一个 forEach 循环，但我有两个 forEach 循环。

这是我的代码：

var result = [];

clusters.forEach((cluster) => {
  getFeatures(cluster_id, (features) => {
  features.forEach((feature) => {
    result.push(feature);
  });
  });
});

//do something with result array
console.log("resulting features array length: " + result.length); //results in 0

Answer 1

您实际上不需要内部 forEach，因为它只是将功能复制到可以使用 .push(...stuff) 完成的结果中，您必须承诺 getFeatures 然后才能在所有承诺上调用 Promise.all，等待他们全部完成：

const result = [];

const allDone = Promise.all(clusters.map((cluster) => new Promise(resolve => {
  getFeatures(cluster_id, (features) => {
    result.push(...features);
    resolve();
  });
})));

allDone.then(() => {
  // result is ready to use here
});

如果您需要按顺序排列结果，您可以用它们解决承诺，然后将结果展平：

 const allDone = Promise.all(clusters.map((cluster) => new Promise(resolve => {
  getFeatures(cluster_id, (features) => {
    resolve(features);
  });
})));

allDone.then((nestedResults) => {
  const result = nestedResults.flat();
  //...
});

Answer 2

您可以将结果转换为 Promise，然后将解析后的数组展平：

Promise.all(clusters.map(cluster => new Promise(resolve => 
    getFeatures(cluster.id, resolve)
  ))
)
// as .flat() doesn't work in Node.js <= 10, this is a workaround:
//.then(clusterFeatures => clusterFeatures.reduce((acc,curr) => [...acc, ...curr], []))
.then(clusterFeatures => clusterFeatures.flat())
.then(features => ... );