Async / Await不等待响应,并返回Promise对象

问题描述 投票:1回答:2

使用ES6,Classes和Async / Await ......

目标是让一个“Api”类用fetch执行异步调用,并返回一些数据......但即使是基础也没有用。

在主js这些片段运行,它启动事件链:

let api = new Api();
let api_data = api.getLocation();

console.log(api_data);

getLocation方法如下,它将返回一些响应/数据。但是,该数据理论上是对API的提取调用,例如等待一段时间的“getTestVariable”...

class Api {
  getLocation = async () => {
    var response = await this.getTestVariale();
    console.log(response);
    return response;
  }


  getTestVariale = () =>{
    setTimeout(function(){
      console.log("timeout done...");
      return "this is the test variable";
    },2000);
  }
 }

但是,1)console.log(响应)给出“未定义”,因为它不等待...和2)回到主js,记录时api_data,是一些Promise对象而不是变量响应

javascript asynchronous ecmascript-6 async-await
2个回答
0
投票

正如上面的评论所述,setTimeout没有返回Promise,因此getTestVariable没有返回值。

这是您的代码的略微修改版本,希望能让您走上正确的轨道:

class Api {
  getLocation = async () => {
    var response = await this.getTestVariale();
    console.log(response);
    return response;
  }


  getTestVariale = () => {
      return new Promise((resolve, reject) => {
          if (thereIsError)
              reject(Error('Error message'));
          else 
              resolve({foo: 'bar'});
      }
  }
}

如果我需要进一步解释,请发表评论我很乐意。


0
投票

getLocationawait的价值将来自this.getTestVariable。为了使这个工作,this.getTestVariable必须返回一个承诺;它可以通过两种方式完成 - 使getTestVariable成为async函数或明确返回Promise。

既然你正在使用setTimeout(这不是一个async函数)你必然会使用Promise。干得好:

class Api {
  async getLocation() {
    return await this.getTestVariable();
  }

  getTestVariable() {
    return new Promise((res, rej) => {
      setTimeout(() => res('test'), 2000)
    });
  }
}

async function main() {
  let api = new Api;

  console.log('Trying to get the location...');
  console.log('Voila, here it is: ', await api.getLocation());
}

main();

看起来很难看,但是如果你使用set timeout,就无法实现它。

重点是getTestVariable的分辨率,你希望它返回的价值。

相当重要的一句话:你可以将getTestVariable标记为async函数,它会增加一个额外的Promise级别,但你仍然会得到所需的结果。

© www.soinside.com 2019 - 2024. All rights reserved.