使用Promise.all后仍得到Promise数组的技术问题求助

问题描述 #

getData 函数预期返回对象数组，但最终返回的 myArray 仍是Promise数组，尽管在 Promise.all 的回调中能打印出真实数据。

问题根源 #

1. 未正确处理Promise数组：若 translationArray 中的元素是Promise（而非直接的{field,lang,text}对象），同步执行reduce时会直接处理Promise对象本身，导致translationByLang数组里全是未resolved的Promise。
2. 错误的数组操作：即使result是正确的Promise数组，await Promise.all(result).then(res => myArray.push(res))会把resolved后的整个数组作为单个元素推入myArray，最终得到二维数组，而非预期的一维对象数组。

修正后的代码 #

情况1：translationArray是Promise数组 #

如果translationArray的元素是Promise，需先等待所有Promise完成再处理：

async function getData() {
    // 先等待所有翻译Promise完成，拿到真实数据
    const resolvedTranslations = await Promise.all(translationArray);
    
    // 按语言分组生成对象数组
    let translationByLang = Object.values(resolvedTranslations.reduce((acc, {field, lang, text}) => {
        acc[lang] = acc[lang] || { lang };
        acc[lang][field] = text;
        return acc;
    }, {}));

    let result = translationByLang;

    // 补全默认英文对象
    if (result.length < 2) {
        const obj = {"lang":"en", "name":"Documento mancante","pdf_url":""};
        result.push(obj);
    }

    // 直接等待所有可能的Promise完成，返回结果数组
    return await Promise.all(result);
}

情况2：translationArray是普通对象数组 #

如果translationArray本身就是{field,lang,text}对象数组，无需Promise.all：

async function getData() {
    let translationByLang = Object.values(translationArray.reduce((acc, {field, lang, text}) => {
        acc[lang] = acc[lang] || { lang };
        acc[lang][field] = text;
        return acc;
    }, {}));

    let result = translationByLang;

    if (result.length < 2) {
        const obj = {"lang":"en", "name":"Documento mancante","pdf_url":""};
        result.push(obj);
    }

    // 直接返回对象数组
    return result;
}

关键修正点 #

• 若涉及Promise数组，必须先通过await Promise.all()拿到resolved后的真实数据，再进行后续处理。
• 避免在await后链式调用then，直接用变量接收await的结果，代码更简洁易读。
• 不要将Promise.all返回的结果数组作为单个元素推入新数组，直接返回该结果数组即可。

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