JavaScript异步代码中try...catch失效：为什么我的异步函数异常没有被捕获？

关于javascript异步代码中try...catch语句失效的问题

在javascript开发中，正确处理异步操作中的错误至关重要。本文将针对一个案例，分析为什么try...catch语句在异步代码中未能捕获异常。

问题描述：一段代码中，refreshdata函数包含一个try...catch块，用于处理refreshtoken函数可能抛出的错误。然而，即使refreshtoken函数发生错误，catch块也没有被执行。

代码片段如下：

let isrefreshtoken = false
const request = (url:string, method:string, data?:any) => {
  return new promise(async (resolve, reject) => {
    if (isrefreshtoken) return
    // 判断token超时，刷新token
    if (store.getters.expirestime && new date().gettime() >= store.getters.expirestime) {
      await refreshdata()
      return
    }
    ...
}

const refreshdata = async () => {
  if (!isrefreshtoken) {
    isrefreshtoken = true
    if (!store.getters.refertoken) {
      cleandata()
      isrefreshtoken = false
    } else {
      console.log(123);
      try {
        let res = await refreshtoken(store.getters.refertoken) 
        store.dispatch('saveinfo', res)  
        isrefreshtoken = false  
        uni.switchtab({ url: '/pages/device/index' })
      } catch (error) {
        cleandata()
      }
      console.log(333);
    }
  }
}

问题在于request函数内部使用了new promise(async (resolve, reject) => { ... })这种方式。async函数内部的await会暂停执行，但并不会将refreshdata函数内部的异常传递给promise的reject函数。

立即学习“Java免费学习笔记（深入）”；

解决方案：

蝉妈妈AI

电商人专属的AI营销助手

下载

有两种方式可以解决这个问题：

第一种方式：将request函数声明为async函数，直接使用await调用refreshdata，这样refreshdata中发生的异常会自动向上冒泡，并被await捕获。

const request = async (url: string, method: string, data?: any) => {
    if (isrefreshtoken) return
    // 判断token超时，刷新token
    if (store.getters.expirestime && new date().gettime() >= store.getters.expirestime) {
        await refreshdata()
        return
    }
}

第二种方式：如果必须使用new promise，则需要在refreshdata函数执行完毕后，通过then和catch方法来处理refreshdata的返回结果和异常。

const request = (url: string, method: string, data?: any): Promise => {
    return new Promise((resolve, reject) => {
        if (isRefreshToken) return
        // 判断token超时，刷新token
        if (Store.getters.expiresTime && new Date().getTime() >= Store.getters.expiresTime) {
            refreshData().then(resolve, reject);
            return
        }
    });
}

需要注意的是，这两种方法都是处理异步错误的方式，并不是同步代码。 await 只是异步编程中的语法糖，它并不能改变异步操作的本质。