如何将变量分配给在其承诺中返回对象的异步类方法的结果？

Question

看起来互联网上没有人描述类似的问题，并且类似的解决方案对我不起作用。 我正在尝试 scrape 网页，因此我为解析器创建了类，其中一种方法如下所示：

 get chListUrl() {
    return "http://www.teleman.pl/program-tv/stacje";
  }

getChannels() {
     var dict = {};
     axios.get(this.chListUrl).then(function (response) {  
       var $ = cheerio.load(response.data);       
        var ile_jest_stacji = $('#stations-index a').length;
        $('#stations-index a').each( (i,elem) => {
          let href = $(elem).attr('href');
          let kodstacji = href.replace(/\/program-tv\/stacje\//ig,'');     
          let nazwastacji = $(elem).text();
          dict[nazwastacji]=kodstacji;
        });
        return  dict;
        
    }).catch(function (error) {
        console.log(error);
        return null;
    }).finally(function() {
        console.log("Koniec");
        
    });
  }

问题是getChannels 必须是间接异步的，因为它包含 axios BUT

let tm = new TM();
var a = tm.getChannels();

a 总是未定义的，它应该是字典！这种构造意味着“将 tm.getChannels() 的执行结果分配给变量”，因此应始终在整个函数结束后进行赋值。否则这样的语言语法是没有用的，因为你永远无法确定变量中存储的是什么值，而且这样的错误很难找到和调试。

var a = await tm.getChannels();

不工作 -> SyntaxError: await 仅在异步函数中有效（嗯？）

将异步添加到 getChannels() 不会改变任何事情。
将异步分配给 getChannels() 并从分配中删除“等待”返回 Promise{undefined}（嗯？）
将 async 放在 axios 之前没有任何改变，因为 .then() 已经处理了响应
将 return dict 更改为 return await dict 会给出另一个“等待仅在异步函数中有效”（嗯？axios 是异步的）

我为此苦苦思索了 2 周。 在 Swift 中，当完成处理程序中返回某些内容时，它会在适当的时候分配给变量，为什么 Promise 返回的内容不以相同的方式工作？

Answer 1

您需要在异步函数中才能使用await expression：

await 运算符用于等待 Promise。它只能在异步函数中使用。

• await operator on MDN

示例来自MDN:

async function f1() {
  var x = await resolveAfter2Seconds(10);
  console.log(x); // 10
}

f1();

解决您的问题

class TM {

  get chListUrl() {
    return "http://www.teleman.pl/program-tv/stacje";
  }

  async getChannels() { // you need not use get syntax 
    let dict = {};
    try { // we will be handling possible errors with try catch instead of reject
        const response = await axios.get(this.chListUrl);
        let $ = cheerio.load(response.data);       
        let ile_jest_stacji = $('#stations-index a').length;
        $('#stations-index a').each( (i,elem) => {
          let href = $(elem).attr('href');
          let kodstacji = href.replace(/\/program-tv\/stacje\//ig,'');     
          let nazwastacji = $(elem).text();
          dict[nazwastacji]=kodstacji;
        });
      return dict;
     } catch(ex) {
      console.log(ex);
      return null
     }
  }

}

// let's make it work!
(async function() {
  const tm = new TM()
  const channels = await tm.getChannels()
  // do whatever you want with channels
  console.log(channels)
})()

现在，您可能不会像这样突然调用getChannels，而是可能会在您自己定义的函数中，您需要将async 关键字添加到该函数中。无论您的代码是什么块函数，都必须是async。

Answer 2

如果你想使用 async/await 语法，你应该删除 .then() 语法，你可以这样解决：

async getChannels() {
     const response = await axios.get(this.chListUrl);
     return response
  }

您可以在链接中了解有关 async/await 的更多信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function