javascript - Promises.all 具有附加值

Question

对 Promise 不熟悉，想学习。我有这个 shopId 数组:

let shopIdsArray = ['shop1','shop2','shop3'];

和外部 promise 调用

getProducts(shopId, 'products') //promise returns the products of this shop

不幸的是，promise 不返回 shopId，只返回产品，所以我必须以某种方式保留 shopId，并在 Promise 完成后将其与产品存储在一起。我当前的方法是使用每个 shopId 调用 Promise，并将每个 Promise 调用的结果添加到 ShopsAndProductsArray 中，如下所示:

shopsAndProductsArray.push({
    "id":shopId,
    "products":products
}); 

稍后，我的“包装 promise ”应该返回完成的shopsAndProductsArray。

我当前的代码( Node ，ES6)如下所示:

updateProducts = new Promise(

    function (resolve, reject) {
        let shopIdsArray = ['shop1','shop2','shop3'];
        const shopsAndProductsArray = [];
        let promisesArray = [];

        shopIdsArray.forEach((shopId) => {
            let promise = getProducts(shopId, 'products')
                    .then((products) => {
                        const shopInfoObject = {
                                 "id":shopId,
                                 "products":products
                        };
                        console.log("sio: ",shopInfoObject); //prints shopIds and products fine.
                        shopsAndProductsArray.push(shopInfoObject);
                        promisesArray.push(promise);
                    });

        });

        Promise.all(promisesArray)
            .then(function (shopsAndProductsArray) {
                resolve(shopsAndProductsArray); //the shopsAndProductsArray is undefined?
            });
    }
);

解析时，shopsAndProductsArray...不为空，但包含与 shopIdsArray 相同数量的条目，但数组项未定义。我可能应该先将 Promise 放入一个数组中，然后在 Promise.all 中处理它们，但此时我丢失了对 Promise 所属商店 id 的引用。

我阅读了许多有关迭代和 promise 的其他示例，并尝试了许多其他方法，但似乎我还没有完全理解此时所谓的内容。我确信按照我的方式填充 Promise 数组是错误的，但我不知道如何调用 Promise.all。

我想我可以将问题缩小到:

1. 我应该如何迭代shopIds，调用promise每个？
2. 一旦 Promise 返回产品列表，如何保留 shopId？
3. 处理完所有 shopId 后，如何返回 shopId 和产品的数组？

预先感谢您的帮助。

编辑:非常感谢你们，Justelouise 和 Felix Kling。我知道我把事情复杂化了，但又不知 Prop 体在哪里。多亏了你的例子，我现在明白了我错过了什么。我认为你们的答案基本上是相同的，并且都得到了彻底的解释。我给 justelouise 打了接受复选标记，因为她似乎是第一名，而 Felix Kling 的声誉稍高一些。

Answer 1

我认为你可以简化你的功能:

return Promise.all(shopIdsArray.map(shopId => {
  return getProducts(shopId).then((products) => {
    return {
      id: shopId,
      products,
    };
  });
}));

Promise.all 返回一个 Promise 数组，当您通过映射函数迭代该数组时创建的 Promise 数组，其中针对每个商店 ID 执行 getProducts 调用。返回产品数据后，您仍然可以访问相应的商店 id，并返回一个由 id 和结果组成的新对象

return {
  id: shopId,
  products,
};

最后，Promise.all 返回一个数组，其中包含在其中执行的每个 Promise 的返回值。