Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/396.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何处理单个阵列上的多个异步调用?_Javascript_Typescript_Asynchronous_Async Await_Es6 Promise - Fatal编程技术网

Javascript 如何处理单个阵列上的多个异步调用?

Javascript 如何处理单个阵列上的多个异步调用?,javascript,typescript,asynchronous,async-await,es6-promise,Javascript,Typescript,Asynchronous,Async Await,Es6 Promise,这是一个更具理论性的问题。我最初打算问这个问题,是否可以在map上迭代两次,但从它的声音来看,它听起来像一个反模式。所以我想我只是走错路了 另请注意:此处的数据作为抽象服务器。我知道我在这里用这里提供的数据做的事情是不必要的,但是请不要太关注数据结构。它并不代表我正在处理的真实数据(更复杂,而且是由客户提供的,我无法更改)。而是将问题处理为如何为每个数组项返回结构化异步调用请:-) 我的问题归结为: 我有一个ids数组,需要在该数组上执行两个单独的异步调用 这两个调用都需要通过(并且在所有i

这是一个更具理论性的问题。我最初打算问这个问题,是否可以在map上迭代两次,但从它的声音来看,它听起来像一个反模式。所以我想我只是走错路了

另请注意:此处的数据作为抽象服务器。我知道我在这里用这里提供的数据做的事情是不必要的,但是请不要太关注数据结构。它并不代表我正在处理的真实数据(更复杂,而且是由客户提供的,我无法更改)。而是将问题处理为如何为每个数组项返回结构化异步调用请:-)


我的问题归结为:

  • 我有一个
    id
    s数组,需要在该数组上执行两个单独的异步调用
  • 这两个调用都需要通过(并且在所有
    id
    实例中)
例如,假设我有两个数据集:

const dataMessages = [
  { id: "a", value: "hello" }, 
  { id: "b", value: "world" }
];

const dataNames = [
  { id: "a", name: "Samuel" },
  { id: "b", name: "John" },
  { id: "c", name: "Gustav"},
];
和API调用模型:

const fetchFor = async (collection: Object[], id: string): Promise<Object> => {
  const user = collection.find(user => user.id === id);
  if (!user) {
    throw Error(`User ${id} not found`);
  }
  return user;
};
然而,无论如何,我需要回报这两个承诺

  • fetchFor(数据消息,id)
  • fetchFor(数据名,id)
承诺中。所有
承诺数组


我想我总是可以简单地为两个API调用实例做两个映射的
flatMap
,但考虑到

  • 我会在同一个数组上做两次array.map
  • 我的数据结构在逻辑上没有连接(同一个用户有两个单独的数组项,它们甚至不会相互后跟)
因此,理想情况下,我希望以

 const result = await Promise.all([...])
 console.log(result)
 /* [
 *   {id: 'a', message: 'hello', name: 'Samuel'},
 *   {id: 'b', message: 'world', name: 'John'},
 *  ]
或者我只需要做承诺的平面映射,然后在解析的Promise.all上的单独处理程序中根据id标识符将数据合并到对象

我在这里提供了一个单一api调用模型的工作示例,因此您不必复制粘贴


处理此类问题的正确/常见方法是什么?

您可以嵌套
承诺。所有
调用:

const [messages, names] = await Promise.all([
  Promise.all(
    ['a', 'b'].map(id => fetchFor(dataMessages, id)
  ),
  Promise.all(
    ['a', 'b', 'c'].map(id => fetchFor(dataNames, id)
  )
]);

如果要在检索后合并结果,只需进行标准数据操作。

您可以嵌套
承诺。所有
调用:

const [messages, names] = await Promise.all([
  Promise.all(
    ['a', 'b'].map(id => fetchFor(dataMessages, id)
  ),
  Promise.all(
    ['a', 'b', 'c'].map(id => fetchFor(dataNames, id)
  )
]);

如果您希望在检索后合并结果,这只是标准数据操作的问题。

为什么需要调用
fetchFor(dataMessages,id)
?您是否只需要将
id
的消息添加到
用户
(如果有的话)?@Andreas否。我知道在这个示例中这是有意义的,但请将它们视为实际数据库中的数据字段,而不是消息/id(显然,实际上我返回的字段不止一个)。我只是选择了这两件事作为问题的抽象,作为(更复杂的)我必须做的事情的表示。问题是在一个映射中返回两个结构化的承诺,所以不要太关注数据结构的正确性,还有什么不合适的:-)为什么需要调用
fetchFor(dataMessages,id)
?您是否只需要将
id
的消息添加到
用户
(如果有的话)?@Andreas否。我知道在这个示例中这是有意义的,但请将它们视为实际数据库中的数据字段,而不是消息/id(显然,实际上我返回的字段不止一个)。我只是选择了这两件事作为问题的抽象,作为(更复杂的)我必须做的事情的表示。问题是在一个映射中返回两个结构化的承诺,所以不要太关注数据结构的正确性,还有什么不合适的:-)哦,是的,现在我回顾一下,我有点困惑,为什么我没有想到简单地想到
Promise.all
这两个Promise可以作为另一个
Promise的参数数组的元素。all
,neat:-)!最后一件事,在我自己的研究之后,我发现你也可以对两个异步调用使用
for of
,但如果我理解正确,
承诺。所有的
方法都更好,因为它可以并发运行,因此在处理大量数据时速度更快,对吗?哦,是的,现在我回顾一下,我有点困惑,为什么我没有想到简单地想到
Promise.all
这两个Promise可以作为另一个
Promise的参数数组的元素。all
,neat:-)!最后一件事,经过我自己的研究,我发现您也可以使用
for of
进行两次异步调用,但如果我理解正确,
承诺。所有的
方法都更好,因为它可以并发运行,因此在处理大数据集时速度更快,对吗?