如何结合Promise与.reduce实现特定条件下的数组嵌套遍历与异步处理？

Got it, let's work through this problem together. You're looking to process nested arrays asynchronously, waiting for all sub-tasks to finish before returning results—using Array.reduce and Promise is exactly the right approach here. Let's break this down with practical examples:

The key here is to combine reduce for iterating over the main RallyResults array, and Promise.all to wait for all async operations in each dataArray to complete. We have two common patterns depending on whether you need sequential or parallel processing of the parent elements.

Sequential Processing (Maintaining Order) #

If you need to process each "Regression" item one after another (e.g., if there's a dependency between them), use this reduce-based approach:

async function processRallyResults(rallyResults) {
  // Use reduce to build a chain of Promises, processing items sequentially
  return rallyResults.reduce(async (accumulatorPromise, currentItem) => {
    // Wait for the previous batch of processing to finish
    const processedResults = await accumulatorPromise;

    // Only handle items where ExecutionType is "Regression"
    if (currentItem.ExecutionType === "Regression") {
      // Process all elements in dataArray in parallel, wait for all to complete
      const processedSubItems = await Promise.all(
        currentItem.dataArray.map(async (dataItem) => {
          // Replace this with your actual async processing logic
          return await handleDataElement(dataItem);
        })
      );

      // Add the processed results to our accumulator
      processedResults.push({
        source: currentItem,
        processedData: processedSubItems
      });
    }

    return processedResults;
  }, Promise.resolve([])); // Start with an empty resolved Promise as the initial value
}

// Example async processing function—replace this with your actual logic
async function handleDataElement(dataItem) {
  // Simulate an async operation (e.g., API call, database write)
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({ ...dataItem, isProcessed: true });
    }, 150);
  });
}

How this works: #

• The reduce callback is marked as async, so each iteration returns a Promise. We await accumulatorPromise to ensure we don't start processing the next item until the previous ones are done.
• Promise.all takes an array of async tasks (from mapping over dataArray) and resolves only when all of them are complete—this guarantees we don't proceed until every sub-element is processed.
• We start with Promise.resolve([]) to give reduce a valid Promise as the initial accumulator.

Parallel Processing (More Efficient) #

If there's no dependency between the "Regression" items and you want to process them all at once for better performance, you can first filter the main array, then use Promise.all for both the parent items and their sub-arrays:

async function processRallyResultsParallel(rallyResults) {
  // First filter down to only the "Regression" items
  const regressionItems = rallyResults.filter(item => item.ExecutionType === "Regression");

  // Process all regression items and their sub-arrays in parallel
  const allProcessedResults = await Promise.all(
    regressionItems.map(async (item) => {
      const processedSubItems = await Promise.all(
        item.dataArray.map(dataItem => handleDataElement(dataItem))
      );
      return { source: item, processedData: processedSubItems };
    })
  );

  return allProcessedResults;
}

Why this is better for most cases: #

• This avoids waiting for one parent item to finish before starting the next, so it's faster when there's no need for sequential processing.
• It still uses Promise.all for the dataArray elements, so you're guaranteed all sub-tasks complete before the parent item's result is added to the final array.

To use either function, simply call it with your RallyResults array and handle the returned Promise:

const RallyResults = [
  { ExecutionType: "Regression", dataArray: [{ id: 1 }, { id: 2 }] },
  { ExecutionType: "Smoke", dataArray: [{ id: 3 }] },
  { ExecutionType: "Regression", dataArray: [{ id: 4 }, { id: 5 }, { id: 6 }] }
];

// Using sequential processing
processRallyResults(RallyResults)
  .then(results => console.log("Sequential results:", results))
  .catch(err => console.error("Error processing:", err));

// Or parallel processing
processRallyResultsParallel(RallyResults)
  .then(results => console.log("Parallel results:", results))
  .catch(err => console.error("Error processing:", err));

内容的提问来源于stack exchange，提问作者Christine Edwards