Explorando 承诺：.all 与 .allSettled / .race 与 .any-js教程-PHP中文网

随着 ECMAScript 6 (ES2015) JavaScript 规范的发布，2015 年出现了一些承诺，让我们作为开发人员在处理异步操作时的体验变得更加简单。

如果您学习或使用 JavaScript，您可能已经使用过 Promise.all() 或 Promise.race()。为了让开发人员的生活更加轻松，随着最新版本 JavaScript 的发布，我们可以访问两个新的 Promises 方法：Promise.allSettled() 和 Promise.any()（分别为 ES11 和 ES2021）。

但是它们之间有什么区别以及我们什么时候应该使用它们？

概括

Promise.all 与 Promise.allSettled：关注结果
Promise.race 与 Promise.any：专注于速度

Explorando Promises: .all vs .allSettled / .race vs .any

Promise.all 与 Promise.allSettled：关注结果

想象一下，您正在开发一个应用程序，在某个时刻需要执行不同的 API 调用。如果这些调用彼此独立，一个好的选择是同时执行所有调用，除了使代码更加简洁之外，还可以提高应用程序的性能。

Promise.all()

接收一个 Promise 数组 作为参数；
同时（并行）执行操作；
当所有 Promise 成功解决时解决；
如果其中一个 Promise 失败，则立即拒绝，并阻止后续 Promise 的执行。

async function buscarDadosParalelo() {  
  const [usuarios, produtos] = await Promise.all([
    fetch('/api/usuarios').then(resp => resp.json()),
    fetch('/api/produtos').then(resp => resp.json()),
  ]);

  return { usuarios, produtos };
}

登录后复制

Promise.all() 当您需要确保所有 Promise 都成功 并且函数在执行其他操作之前收到所需的所有结果时

非常有用。 >

Promise.allSettled()

还接收一个 Promise 数组 作为参数；
还同时（并行）执行操作；
当所有 Promise 完成执行时解析，无论成功还是失败，为每个 Promise 返回一个包含其状态（已完成或拒绝）的对象；
从不拒绝，因此也不会阻止 Promise 的执行。

async function buscarDadosParaleloComFalhas() {   
  const resultados = await Promise.allSettled([
    fetch('/api/usuarios').then(resp => resp.json()),
    fetch('/api/produtos').then(resp => resp.json()),
  ]);

    // Verificar cada resultado individualmente:
  const dados = resultados.map(resultado => {
    if (resultado.status === 'fulfilled') {
      return resultado.value;
    } else {
      console.error(resultado.reason);
      return null;
    }
  });

  return dados;
}

登录后复制

Promise.allSettled() 如果任何 Promise 以失败结束，则不会阻止应用程序，此外允许单独处理每个调用的成功或错误。它就像一个状态报告，等待所有请求得到解决或拒绝，并允许用户评估和处理每个案例。

返回摘要

Promise.race 与 Promise.any：专注于速度

另一方面，当我们谈论 Promise.race() 和 Promise.any() 时，我们讨论的是处理一组异步操作中的第一个响应的方法。

Promise.race()

赢得数组脚本化的Promise；
同时（并行）执行操作；
返回第一个已完成或被拒绝的 Promise。

async function buscarDadosParalelo() {  
  const [usuarios, produtos] = await Promise.all([
    fetch('/api/usuarios').then(resp => resp.json()),
    fetch('/api/produtos').then(resp => resp.json()),
  ]);

  return { usuarios, produtos };
}

登录后复制

Promise.race() 当我们需要快速响应时非常有用 - 第一个可用的返回，无论是成功还是错误。它还广泛与超时一起使用，如上例，以确保我们在限定时间内有任何响应，并且可以防止缓慢的请求继续消耗资源。

Promise.any()

您还可以获得一个脚本化 Promise 数组；
同时（并行）执行操作；
返回第一个成功完成的Promise，忽略拒绝；
仅当所有 Promise 都被拒绝时才拒绝。

async function buscarDadosParaleloComFalhas() {   
  const resultados = await Promise.allSettled([
    fetch('/api/usuarios').then(resp => resp.json()),
    fetch('/api/produtos').then(resp => resp.json()),
  ]);

    // Verificar cada resultado individualmente:
  const dados = resultados.map(resultado => {
    if (resultado.status === 'fulfilled') {
      return resultado.value;
    } else {
      console.error(resultado.reason);
      return null;
    }
  });

  return dados;
}

登录后复制

Promise.any() 当您需要至少一个请求成功完成时很有用，非常适合后备和冗余，如何从多个来源（CDN、本地等）加载资源或在失败时连接到不同的服务器。

返回摘要

Explorando Promises: .all vs .allSettled / .race vs .any