我如何使用 async 和 await ？它不工作

Question

好吧，我有三个函数，我希望执行第一个函数以获取其 ID，然后可以执行第二个和第三个函数，这是一个示例：

  async persistAll()
{
  await (this.AddElement());
   this.AddElement2( this.Id);
   this.AddElement3( this.Id);
   
}

正如我所说，我希望第一个函数先完成，然后其他函数可以完成它们的工作，SetTimeOut 工作正常，但我不想使用它，因为它取决于我将发送多少数据。 这是 AddElement 函数的示例：

   async AddElement (){
       let a = 1,
       let b = 2
       id= a+b
      return new Promise(resolve => {id})
}

这只是我正在尝试做的一个例子，无论如何它根本不等待我也尝试过

Promise.resolve(id)

我做错了什么？谢谢。

Answer 1

您的 AddElement 函数返回的不是Promise<number>，而是Promise<Promise<number>>。这是因为async/await 是句法助手；对于异步函数，任何自动返回的值都会被包装在一个 Promise 中。

在您的情况下，您可以让 typescript 通过显式注释返回类型来帮助您找到问题。改写这个，它应该会给你一个编译器错误：

async AddElement (): Promise<number>{
   let a = 1,
   let b = 2
   id= a+b
   return new Promise(resolve => {id})
}

要修复它，删除new Promise，然后写

async AddElement(): Promise<number>{
   let a = 1;
   let b = 2;
   id= a+b;
   return id;
}

这是TS playground with a working example。它产生这个输出：

[LOG]: "AddElement",  3
[LOG]: "AddElement2", 3
[LOG]: "AddElement3",  3
[LOG]: "Done"

作为参考，这里是该游乐场的完整代码：

const example = {
    Id: 0,

    async persistAll()
    {
        this.Id = await (this.AddElement());
        this.AddElement2(this.Id);
        this.AddElement3(this.Id);
    },

    async AddElement(): Promise<number>{
        let a = 1;
        let b = 2;
        const id = a+b;
        console.log("AddElement", id);
        return id;
    },

    AddElement2(id: number) {
        console.log("AddElement2", id);
    },

    AddElement3(id: number) {
        console.log("AddElement3", id);
    }
}

example.persistAll().then(() => console.log("Done"));

Answer 2

我认为这就是你要找的东西：

async persistAll(){
 this.id = await this.addElement();
 this.AddElement2( this.Id);
 this.AddElement3( this.Id);
}

async AddElement (){
       let a = 1,
       let b = 2
       id= a+b
      return new Promise(resolve => {id})
}

拥有一个沙盒或更多代码有助于更好地了解您正在尝试做什么