js 中的错误处理.
分为三块吧.
第一:普通的js中 错误处理.
第二: promise 中的错误处理
第三: async 中的错误处理
第一: 普通的js 的错误处理
说普通是因为比较简单,算一个知识点没有太多啥说的,大家找找资料比较齐全
https://www.sitepoint.com/exceptional-exception-handling-in-javascript/ try{ ... //异常的抛出} catch(e){ ... //异常的捕获与处理} finally{ ... //结束处理}
第二: promise 中的错误处理
在promise 中处理错误,我们通常也是去try catch,但是 只能catch 到同步的错误,如果是异步的,比如我们settimeout一下其实是catch不到的.来个栗子:
var promise = new Promise(function(resolve, reject){ setTimeout(function(){ throw new Error('test') }, 0) resolve('ok'); //输出 }); promise .then(function(value){ console.log(value) }) .catch(()=> console.log('err'))
栗子
可以看到,只输出了ok,然后浏览器捕获的错误,catch并没有拿到.
然后看看我们使用reject 来抛出错误
reject
可以看到,reject 会不停的返回到下一个,但是并不会被catch 到.如果我们试试throw 一个error呢?
throw error
通过一层层throw 在catch 里面我们是可以拿到的,疑问来来, 如果是通过 异步promise 里面reject 能catch 到么?
异步
依然是可以拿到的.
好啦最后总结一下吧.在promise 中, 如果使用reject 错误,必须要再每个then函数中throw 出去,不然在catch中无法拿到.其实我们不需要再次的throw ,在promise 正常catch 就好,比如在上面的异步中我们reject一下在最后就能catch到. 需要注意的一点就是:promise 中的错误是不会影响外层的运行,window.onerror 也是无法检测到的.
第三: async 中的错误处理
async用起来确实方便很多,promise 导致整段代码都是promise 的then ,如果判断太多导致代码逻辑复杂难以维护,而且每个then 都有自己的作用域,如果要贡献数据 通常要在外层新建一个.
直接贴代码吧,看看async 正常处理异步的方式
const f = () => { return new Promise((resolve, reject) => { setTimeout(() => { reject(234); }, 2000); }); }; const testAsync = () => { try { const t = await f(); console.log(t); } catch (err) { console.log(err); } }; testAsync();
可以看到,可以使用同步的方式来处理error,但是如果判断很多,多个异步又会导致到处都是判断和try catch.因此国外的大神Dima Grossman给出了一个解决方案.直接贴官方的传送门!
https://github.com/scopsy/await-to-js
下面这个链接是一位大佬对await to js 使用中的改进.很值得一看,对优化自己的代码和流程很又帮助.
https://segmentfault.com/a/1190000011802045