如何给所有的 await async 函数添加try/catch?做全局捕获异常。
面试官:如何给所有的 await async 函数添加try/catch?做全局捕获异常。 我们可以使用 window.addEventListener('unhandledrejection', function (event) {}) 读音: unhandled 【an han dou】 rejection 【rɪ 'dʒe k ʃ(ə)n】 event有个reason属性,里面有error的message和堆栈信息… 要event.preventDefault()阻止冒泡才行 mdn 对于 unhandledrejection 的解释 当 Promise 被 reject 且没有 reject 处理器的时候,会触发 unhandledrejection 事件; 这可能发生在 window 下,但也可能发生在 Worker 中。 这对于调试和为意外情况提供后备错误处理非常有用。
我们来看一下下面这一段代码
async function fn() { let value = await new Promise((resolve, reject) => { reject('我报错啦'); }) console.log('do something...'); } fn()
出现的现象
好家伙直接在控制台报错了。后面又没有捕获异常。 那怎么去解决这个问题呢? 可以使用catch捕获异常
使用catch处理异常
async function fn() { let value = await new Promise((resolve, reject) => { reject('我报错啦'); }).catch(err=>{ console.log('捕获到了异常:',err) }) console.log('do something...'); } fn()
喊上层自己处理(手动狗头)
async function fn() { let value = await new Promise((resolve, reject) => { reject('我报错啦'); }) console.log('do something...'); } fn().then(res=>{ console.log('res',res) }).catch(err=>{ console.log('上层使用者捕获:',err) })
捕获 window.addEventListener 捕获异常
window.addEventListener("unhandledrejection", function (event) { console.log('全局捕获', event ) event.preventDefault() }) async function fn() { let value = await new Promise((resolve, reject) => { reject('failure'); }) console.log('do something...'); } fn()
用最简单的语言总结一下
unhandledrejection 事件监听 reject异常。 或者说 unhandledrejection 最全局异常捕获 再者说 unhandledrejection给所有的 await async 函数添加try/catch