JavaScript异步代码中try…catch失效分析及解决方案
在JavaScript开发中，妥善处理异步操作的错误至关重要。本文将剖析一段代码，解释其异步函数中try…catch块未能捕获预期错误的原因，并提供相应的解决方案。
代码的核心在于request函数和refreshdata函数的交互。request函数发起网络请求，并在token过期时调用refreshdata函数刷新token。refreshdata函数内部使用try…catch块处理refreshtoken函数可能抛出的错误。然而，即使refreshtoken函数出错，catch块也未执行。
问题代码：
立即学习“Java免费学习笔记（深入）”；
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的使用方式。Promise构造函数内部使用了async函数，导致await refreshdata()产生的错误不会被Promise的reject函数捕获。await关键字使异步代码看起来像同步代码，但其异步本质不变，错误处理需与Promise机制正确结合。
解决方案：
提供两种解决方案：
方案一：将request函数声明为async函数
直接使用await等待refreshdata的结果，refreshdata中的try…catch块即可正常捕获错误，并通过Promise机制传递到request函数的调用方。
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; } // ...其他代码};
方案二：在request函数中使用Promise的then和catch方法
将refreshdata的返回值（一个Promise对象）正确传递给then和catch方法。
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，但这仍然是异步代码，并非同步代码。await只改变了代码书写方式，其异步本质不变。正确的错误处理仍然依赖于Promise机制。 选择方案一通常更简洁易读。
以上就是JavaScript异步代码中try…catch失效：为什么我的异步函数try…catch块无法捕获错误？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1502762.html
微信扫一扫 
支付宝扫一扫 
