JavaScript异步代码中try...catch语句失效的原因是什么？-js教程-PHP中文网

JavaScript异步代码中try...catch语句失效的原因是什么？

心靈之曲

发布： 2025-02-27 08:02:21

原创

856人浏览过

javascript异步代码中try...catch语句失效的原因是什么？

JavaScript异步代码中try...catch失效分析及解决方案

本文分析一段JavaScript代码，该代码试图在异步操作中使用try...catch处理错误，但未能捕获异常。我们将解释原因并提供解决方案。

问题代码：

<code class="javascript">let isrefreshtoken = false;
const request = (url, method, data) => {
  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);
    }
  }
};</code>

登录后复制

问题根源：

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

request函数中使用了new Promise(async (resolve, reject) => { ... })这种非最佳实践。async函数内部的await会暂停Promise的执行，但不会将await内部函数抛出的异常传递给Promise的reject函数。因此，refreshdata函数中的try...catch虽然能捕获refreshtoken函数的异常，但该异常不会被request函数捕获。

解决方案：

代码小浣熊

代码小浣熊是基于商汤大语言模型的软件智能研发助手，覆盖软件需求分析、架构设计、代码编写、软件测试等环节

查看详情

有两种方法解决此问题：

方法一：将request函数声明为async函数

将request函数改为async函数，直接使用await等待refreshdata函数的执行。这样，refreshdata函数中抛出的异常会自动向上冒泡，最终被request函数的调用者捕获（或导致程序崩溃）。

<code class="javascript">const request = async (url, method, data) => {
  if (isrefreshtoken) return;
  // 判断token超时，刷新token
  if (store.getters.expirestime && new Date().getTime() >= store.getters.expirestime) {
    await refreshdata();
    return;
  }
  // ...其他代码
};</code>

登录后复制

方法二：在request函数中正确处理refreshdata的Promise

保持request函数返回Promise对象，但在refreshdata函数执行完成后，正确调用resolve或reject函数处理结果和错误。

<code class="javascript">const request = (url, method, data) => {
  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;
    }
    // ...其他代码
  });
};</code>

登录后复制

重要说明： 两种方法都处理了异步操作，即使使用了await，代码仍然是异步的，而非同步的。选择哪种方法取决于代码的整体架构和需求。方法一更简洁，但可能需要调整调用request函数的方式。方法二更灵活，但代码略微复杂。

以上就是JavaScript异步代码中try...catch语句失效的原因是什么？的详细内容，更多请关注php中文网其它相关文章！