在 Promise.all 中使用 .map

Dev*_*son 2 javascript promise axios

因此,我有一些需要在 Express 服务器的 init 上运行的承诺。

const dates = [];
for (var i = 0; i <= 8; i++) {
  dates.push(
    moment()
      .add(i, "days")
      .format("YYYY-MM-DD")
  );
}
const [cityName, weatherData, celestialData] = await Promise.all([
  axios.get(
    `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${myKey}`
  ),
  axios.get(
    `https://api.darksky.net/forecast/${myKey}/${latitude},${longitude}`
  ),
  dates.map(date => {
    axios.get(
      `https://api.ipgeolocation.io/astronomy?apiKey=${myKey}&lat=${latitude}&long=${longitude}&date=${date}`
    );
  })
]);
Run Code Online (Sandbox Code Playgroud)

我需要 8 个不同天的数据,所以我想通过运行带有日期数组的 .map,我会得到另一个数组,其中包含每个数组的已解决承诺。这并不像我预期的那样工作。如何管理 Promise.all 内循环的 axios 调用?

T.J*_*der 5

你们真的很接近。你想要

\n\n
    \n
  1. 将数组展开dates.map
  2. \n
  3. 在解构过程中将结果捕获到剩余元素中
  4. \n
  5. axios从回调map中返回结果
  6. \n
\n\n

大致:

\n\n
const [cityName, weatherData, ...celestialData] = await Promise.all([\n// 2 \xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92^^^\n  axios.get(\n    `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${myKey}`\n  ),\n  axios.get(\n    `https://api.darksky.net/forecast/${myKey}/${latitude},${longitude}`\n  ),\n  ...dates.map(date => {\n//^^^\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92 1\n    return axios.get(\n//\xe2\x88\x92\xe2\x88\x92^^^^^^ 3\n      `https://api.ipgeolocation.io/astronomy?apiKey=${myKey}&lat=${latitude}&long=${longitude}&date=${date}`\n    );\n  })\n]);\n
Run Code Online (Sandbox Code Playgroud)\n\n

celestialData将是日期结果的数组。

\n\n

如果您愿意,您可以为第三部分使用简洁的箭头函数:

\n\n
  ...dates.map(date => axios.get(\n    `https://api.ipgeolocation.io/astronomy?apiKey=${myKey}&lat=${latitude}&long=${longitude}&date=${date}`\n  )\n
Run Code Online (Sandbox Code Playgroud)\n\n
\n\n

旁注:您当前创建dates数组的方式很好,但如果您愿意,您可以使用Array.from\ 的映射功能:

\n\n
const dates = Array.from(\n  Array(9),\n  (_, i) => moment().add(i, "days").format("YYYY-MM-DD")\n);\n
Run Code Online (Sandbox Code Playgroud)\n\n
\n\n

由于Seblor尚未将其作为答案发布,因此这是他们的方法(这对我来说似乎更好,因为它避免了展开数组只是为了在解构中使用剩余元素再次将其收集起来):

\n\n
const [cityName, weatherData, celestialData] = await Promise.all([\n  axios.get(\n    `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${myKey}`\n  ),\n  axios.get(\n    `https://api.darksky.net/forecast/${myKey}/${latitude},${longitude}`\n  ),\n  Promise.all(dates.map(date => {\n    return axios.get(\n      `https://api.ipgeolocation.io/astronomy?apiKey=${myKey}&lat=${latitude}&long=${longitude}&date=${date}`\n    );\n  }))\n]);\n
Run Code Online (Sandbox Code Playgroud)\n

  • 通过将 `...dates.map` 替换为 `Promise.all(dates.map =&gt; [...]` ,是否也可以避免执行第一点和第二点? (2认同)