这个 async-await 方法调用究竟是如何工作的？这是正确的吗？答案

【问题标题】：How exactly works this async-await method call? is it correct?这个 async-await 方法调用究竟是如何工作的？这是正确的吗？
【发布时间】：2021-05-16 04:02:48
【问题描述】：

我不太喜欢 Angular 和异步编程，我有以下疑问。

进入服务类我有这个异步方法：

  async aestheticEvaluationExist(patientUID: string) {
    console.log("patientUID: ", patientUID);
    //return this.firestore.collection('aestetic-evaluation').doc(patientUID).get();   

    //const docRef = (await this.firestore.collection('aestetic-evaluation').doc(patientUID).);
    const exists: boolean = (await this.firestore.collection('aesthetic-evaluation').doc(patientUID).get().toPromise()).exists;

    console.log("aesteticEvaluationExist() exists: ", exists);

    return exists;
  }

然后进入我的组件类我有这个方法调用之前的服务方法::

let isUpdate = true;
(await this.patientService.aestheticEvaluationExist(this.patientUID)
                   .then(res => {
                                  console.log("RES: ", res);
                                  isUpdate = res;
                                }));

console.log("isUpdate: ", isUpdate);

如您所见，它在方法调用之前有 awayt 关键字。

它似乎工作正常（输出是正确的）事实上进入 then() 我的 res 是假的，当我通过最后一个 console.log() 行打印它时它打印 false，表示原来的真值被正确覆盖了。

我正在询问该 async 服务方法定义是否在方法调用上带有 await 关键字，以确保我的最后一个 console.log() 行在我的方法完成之后执行。

我的理解正确吗？或者为了确保正确的结果，我必须在 then() 中执行最后一个操作？

【问题讨论】：

没有理由将await 和then 混在同一个地方。它工作，但它是不必要的复杂。 let isUpdate = await this.patientService.aestheticEvaluationExist(this.patientUID) 也是如此，它更短，更易于阅读、理解和调试。

标签： angular typescript async-await angular-promise

【解决方案1】：

我正在询问这个异步服务方法定义是否在方法调用上带有 await 关键字，它确保我的最后一个 console.log() 行在我的方法完成之后执行。

是的，大致上。 async/await 是用于创建和使用 Promise 的语法。 async 函数返回一个承诺。当async 函数中的代码到达第一个await 时，函数返回它的promise，等待代码使用await 解决，然后继续执行函数逻辑，最终解决async 的promise函数返回。

所以函数的逻辑不会进展到console.log，直到你awaiting 的承诺得到解决。

请注意，很少有理由将对诸如then 和catch 之类的promise 方法的显式调用与async/await 语法结合起来。使用其中一种。（也无需将await 运算符和操作数包装在() 中。）在这种情况下，您可以替换：

let isUpdate = true;
(await this.patientService.aestheticEvaluationExist(this.patientUID)
    .then(res => {
        console.log("RES: ", res);
        isUpdate = res;
    }));
console.log("isUpdate: ", isUpdate);

与

let isUpdate = true;
const res = await this.patientService.aestheticEvaluationExist(this.patientUID);
console.log("RES: ", res);
isUpdate = res;
console.log("isUpdate: ", isUpdate);

甚至可能

let isUpdate = await this.patientService.aestheticEvaluationExist(this.patientUID);
console.log("isUpdate: ", isUpdate);

【讨论】：

FWIW，我在最近一本书 JavaScript: The New Toys 的第 8 章中详细介绍了 Promise，然后继续介绍 async /await 在第 9 章中。如果您有兴趣，请在我的个人资料中链接。

【解决方案2】：

我的理解正确吗？

不，您不要将 async / await 与 .then() 语法结合起来，因为它们都试图完成相同的工作。

以下是等价的。

const myResult = await this.someAsyncFunction();
console.log(myResult);

和

this.someAsyncFunction().then(myResult => {console.log(myResult);});

所以在您的示例中，您需要执行以下操作

const isUpdate = await this.patientService.aestheticEvaluationExist(this.patientUID)
console.log("isUpdate: ", isUpdate);

【讨论】：