javascript - 在Javascript中异步等待是否等待所有嵌套函数完成？

Question

在下面的示例中，我需要在 fetch 方法中调用 fetchData 之前重置一些值。async await 是否等待 reset 方法中的所有功能完成后再继续？

fetch = async () => {
  await this.reset();
  this.props.fetchData();
};

reset = () => {
  this.props.resetFilter();
  this.props.resetClient();
  this.props.resetUser();
};

还是您必须执行以下操作？

fetch = () => {
  this.reset().then(() => {
    this.props.fetchData();
  });
};

reset = async () => {
  await this.props.resetFilter();
  await this.props.resetClient();
  await this.props.resetUser();
};

谢谢 ：）

标签： javascriptreactjsasync-awaites6-promise

Answer 1

async/await不会神奇地处理异步函数。它是一种语法添加，可让您更轻松地使用 Promise。

所以每当一个函数返回一个 Promise 时，你都需要显式地等待它。

如果您想按顺序执行它们，可以在每个前面写await，如您在第二个示例中所示：

reset = async () => {
  await this.props.resetFilter();
  await this.props.resetClient();
  await this.props.resetUser();
};

或者，如果您想允许那些异步函数交错Promise.all：

reset = async () => {
  await Promise.all([
    this.props.resetFilter(),
    this.props.resetClient(),
    this.props.resetUser()
  ])
};

如果您不等待第一个示例中的承诺：

reset = () => {
  this.props.resetFilter();
  this.props.resetClient();
  this.props.resetUser();
};

那么这三个调用的承诺链被破坏了，这可能看起来不是一个问题，特别是如果你假设它们总是解决。但是，如果其中一个 Promise 被拒绝，可能会导致未处理的拒绝。