Question

同时使用async/await和.then().catch()有什么危害，例如：

async apiCall(params) {
    var results = await this.anotherCall()
      .then(results => {
        //do any results transformations
        return results;
      })
      .catch(error => {
        //handle any errors here
      });
    return results;
  }

Answer 1

异步函数可以包含一个await表达式，该表达式会暂停执行异步功能并等待传递的Promise 解决，然后恢复异步函数的执行和返回解析值。

从下面的示例中可以看到，您可以使用两种方法来处理await结果和错误，关键字await使JavaScript等待该promise稳定并返回其结果。因此，这没有什么害处（我不完全了解您所说的伤害）。

function returnpromise(val) {
  return new Promise((resolve, reject) => {
    if (val > 5) {
      resolve("resolved"); // fulfilled
    }
    else {
      reject("rejected"); // rejected
    }
  });
}

//This is how you handle errors in await
async function apicall() {
  try {
    console.log(await returnpromise(5))
  }

  catch (error) {
    console.log(error)
  }
}

async function apicall2() {
  await returnpromise(8).then((re) => {
    console.log(re)
  }).catch((error) => {
    console.log(error)
  })
}

apicall2();
apicall();

有关更多参考，请参阅-MDN DOCS

Answer 2

不想复活死者，但想指出使用 await 和 then 链意味着：

const x = await someAsyncFn().then(() => doSomeLogging());

x 的值被分配了 .then 的返回值，这对我来说不是很直观。

Answer 3

如果您使用Async / await，则无需链接.then()，只需将您resolve()返回的结果存储在变量中（示例中为response），但是如果需要处理错误，您必须尝试/捕获代码：

async function f() {

  try {
    let response = await fetch('http://no-such-url');
  } catch(err) {
    alert(err); // TypeError: failed to fetch
  }
}

在您的诺言中使用：

throw new Error("oops!");

或

Promise.reject(new Error("Whoops!"));

Answer 4

我总是使用async/await和.catch()而不是使用async/await和try/catch来紧凑地编写代码。

async function main() {
  const result = await asyncTask().catch(error => console.error(error));
}

Answer 5

我不认为混合使用 async/await + then 是个好主意。尤其是当你专注于 async func 的 res 时，混合使用会带来一些风险，悄悄地扭曲你的 res。

示例：

const res = await fetchData().then(()=>{return "something else"}).catch((err)=>{});

console.log(res); // not expected res data but something else

所以，混合使用是危险的，顺便说一句，它会损害阅读代码。

一起使用async await和.then

5 个答案: