0%

2020-12-17 【娱乐向】JavaScript 异常处理的正确打开方式

【娱乐向】JavaScript 异常处理的正确打开方式

废话不多说,先来看一段代码

1
2
3
4
5
6
7
function funnyCatchError(cb: () => any) {
try {
cb()
} catch (error) {
window.open(`https://www.baidu.com/s?wd=${error.message}`)
}
}

想必稍有点 JavaScript 知识的人都知道这段代码在干什么,就是在 cb() 函数出错的时候把页面自动跳转到百度……

这段代码是以前不知道在什么地方看到的,具体的我也忘了,大概就是这么个逻辑,下面我们来优化一下(一本正经)。

新增对异步函数的支持

上面这段代码仅只是同步函数,对于异步函数的支持并不友好,下面我们来优化一下,让它支持 async/await。

对于异步函数的支持,只需要在执行函数前使用 await 即可,如果是同步函数则会直接返回结果。

同时 await 只能用在异步函数内,所以修改为异步函数

1
2
3
4
5
6
7
async function funnyCatchError(cb: () => any) {
try {
await cb()
} catch (error) {
window.open(`https://www.baidu.com/s?wd=${error.message}`)
}
}

显然,这段代码并没有对环境进行判断,由于这种骚操作只能在浏览器端使用,因此最好先判断是否为浏览器环境。

虽然 Node.js 端也可以采用自动打开浏览器的方式,但考虑到后端都是跑在 Linux 服务器上的,都不一定有浏览器,所以还是算了吧

判断是否为浏览器

只要判断有没有 window 对象就完事了。

1
2
3
4
5
6
7
8
9
async function funnyCatchError(cb: () => any) {
try {
await cb()
} catch (error) {
if (!window){
throw error
}
}
}

下面来判断 error 的数据类型。

判断 error 的数据类型

考虑到并不是所有人抛异常的时候都是乖乖的抛个 Error 对象出来,因此我们这里还要做一层判断,同时加入对 string 的支持。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
async function funnyCatchError(cb: () => any) {
try {
await cb()
} catch (error) {
if (!window){
throw error
}
let errorMessage: string
if (error instanceof Error){
errorMessage = error.message
} else if (typeof error === 'string'){
errorMessage = error
}
}
}

最后就可以跳转搜索引擎了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
async function funnyCatchError(cb: () => any) {
try {
await cb()
} catch (error) {
if (!window){
throw error
}
let errorMessage: string
if (error instanceof Error){
errorMessage = error.message
} else if (typeof error === 'string'){
errorMessage = error
}
if (errorMessage){
console.error(error)
window.open(`https://www.baidu.com/s?wd=${errorMessage}`)
//直接弹窗是有可能被浏览器拦截的,因此也可以采用以下的方式
// window.location.href = `https://www.baidu.com/s?wd=${errorMessage}`
}
}
}

其他情况的冗余兜底

如果 errorMessage 为空就把异常向上抛出

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
async function funnyCatchError(cb: () => any) {
try {
await cb()
} catch (error) {
if (!window){
throw error
}
let errorMessage: string
if (error instanceof Error){
errorMessage = error.message
} else if (typeof error === 'string'){
errorMessage = error
}
if (errorMessage){
console.error(error)
window.open(`https://www.baidu.com/s?wd=${errorMessage}`)
return
}
throw error
}
}

结尾

这次实现了一个娱乐向的异常处理函数,具体的代码放在了GitHub上,感兴趣的小伙伴可以看一下。

顺便在此郑重提醒:本函数纯属娱乐,生产环境请勿使用,否则后果自负

GitHub地址:https://github.com/CaoMeiYouRen/funny-catch-error

本文作者:草梅友仁
本文地址: https://blog.cmyr.ltd/archives/9e20a9ab.html
版权声明:转载请注明出处!

坚持原创技术分享,您的支持将鼓励我继续创作!