标签导航:

关于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函数。

解决方案:

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

第一种方式:将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<unknown> => {
    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 只是异步编程中的语法糖,它并不能改变异步操作的本质。