如何将等待数据转换为单个数组？

Question

我有这段代码，我想把它放在一个数组中。

数据产生的输出是这样的：

  connections.elements.map((val: any) => {
   const url = 'link'
   return new Promise((resolve) => {
      axios.post(url, val.firstName).then((res: { data: any }) => {
        resolve(searchRequestBuilder(res.data.AllResults));
      });
    });
  });

  const searchRequestBuilder = async (data: any) => {
    console.log(await data);
    // for await (let resolvedPromise of data) {
    // console.log(resolvedPromise);
    // }
  };

我想做的是这样的：

我已经尝试创建一个变量并使用 .push，但它仍然没有合并到一个数组中。我错过了什么？

Answer 1

您可以尝试使用 .concat:

let allData = [];
allData = allData.concat(await data);

Answer 2

主要问题可能是您正在为元素数组的每个项目进行新调用。这可能会产生性能问题。最佳做法可能是只执行一次异步调用，然后获取所有项目。

无论如何，如果出于某种原因您确实需要进行所有这些 ajax 调用。认为您正在使用异步代码，那么您真的不知道所有调用何时得到响应。要解决此问题，您需要在完成所有调用后调用您的 searchRequestBuilder。

我建议你使用Promise.all方法。 I left you this link 向您展示它是如何工作的。基本上你需要做的是将所有 axios.post promises 保存在一个数组中，然后循环你的元素数组调用 Promises.all 传递数组和你的 promises，然后你就可以执行你的 searchRequestBuilder没问题。

Answer 3

因此，由于您的 .map 函数将 return 一个承诺数组，您可以将其存储在一个变量中，并且可以使用 Promise.all 或 Promise.allSettled 等待所有apis 来解析，您可以按照请求的顺序将所有结果放在一个数组中。

不是问题的一部分，另一件事是如果你不小心，并且在每个 api 请求上使用等待，它可以形成请求的瀑布模式，这意味着它将等待 API 1 完成，然后 API 2 完成。但是按照这里的写法，它将并行发出所有请求，因此这将同时请求所有 API，一旦最后一个请求得到解决，Promise.all 或 allSettled 将触发其回调。

    const searchRequestBuilder = async (data: any) => {
         console.log(await data);
    }
    async function makeAPIrequests(){    
         let arrrayOfPromises = connections.elements.map((val: any) => {
           const url = 'link'
           return new Promise((resolve) => {
              axios.post(url, val.firstName).then((res: { data: any }) => {
                resolve(searchRequestBuilder(res.data.AllResults));
              });
            });
          });
        
         Promise.allSettled(arrrayOfPromises).
            then((results) => console.log(results))
 
    }

编辑：此外，除此之外，我认为您不需要 return 地图功能中的新 Promise，如果您只是 return axios 它应该可以工作，因为 axios 本身会 return承诺。

如何将等待数据转换为单个数组？

How to convert await data into single array?

javascript

arrays

reactjs

es6-promise