捕获未处理的Promise错误方法


Posted in Javascript onOctober 13, 2017

为了保证可读性,本文采用意译而非直译,并且对源代码进行了大量修改。另外,本文版权归原作者所有,翻译仅用于学习。

使用Promise编写异步代码时,使用reject来处理错误。有时,开发者通常会忽略这一点,导致一些错误没有得到处理。例如:

function main() {
asyncFunc()
.then(···)
.then(() => console.log('Done!'));
}

由于没有使用catch方法捕获错误,当asyncFunc()函数reject时,抛出的错误则没有被处理。

这篇博客将分别介绍在浏览器与Node.js中,如何捕获那些未处理的Promise错误。

浏览器中未处理的Promise错误

一些浏览器(例如Chrome)能够捕获未处理的Promise错误。

unhandledrejection

监听unhandledrejection事件,即可捕获到未处理的Promise错误:

window.addEventListener('unhandledrejection', event => ···);

这个事件是PromiseRejectionEvent实例,它有2个最重要的属性:

promise: reject的Promise

reason: Promise的reject值

示例代码:

window.addEventListener('unhandledrejection', event =>
{
console.log(event.reason); // 打印"Hello, Fundebug!"
});
 
function foo()
{
Promise.reject('Hello, Fundebug!');
}
 
foo();

Fundebug的JavaScript错误监控插件监听了unhandledrejection事件,因此可以自动捕获未处理Promise错误。

rejectionhandled

当一个Promise错误最初未被处理,但是稍后又得到了处理,则会触发rejectionhandled事件:

window.addEventListener('rejectionhandled', event => ···);

这个事件是PromiseRejectionEvent实例。

示例代码:

window.addEventListener('unhandledrejection', event =>
{
console.log(event.reason); // 打印"Hello, Fundebug!"
});
 
window.addEventListener('rejectionhandled', event =>
{
console.log('rejection handled'); // 1秒后打印"rejection handled"
});
 
 
function foo()
{
return Promise.reject('Hello, Fundebug!');
}
 
var r = foo();
 
setTimeout(() =>
{
r.catch(e =>{});
}, 1000);

Node.js中未处理的Promise错误

监听unhandledRejection事件,即可捕获到未处理的Promise错误:

process.on('unhandledRejection', (reason, promise) => ···);

示例代码:

process.on('unhandledRejection', reason =>
{
console.log(reason); // 打印"Hello, Fundebug!"
});
 
function foo()
{
Promise.reject('Hello, Fundebug!');
}
 
foo();

注: Node.js v6.6.0+ 默认会报告未处理的Promise错误,因此不去监听unhandledrejection事件也没问题。

Fundebug的Node.js错误监控插件监听了unhandledRejection事件,因此可以自动捕获未处理Promise错误。

以上这篇捕获未处理的Promise错误方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript客户端脚本的设计和应用
Aug 21 Javascript
JavaScript的面向对象(二)
Nov 09 Javascript
JavaScript异步编程Promise模式的6个特性
Apr 03 Javascript
如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗?”
Mar 05 Javascript
jQuery实现网页抖动的菜单抖动效果
Aug 07 Javascript
浅析javascript函数表达式
Feb 10 Javascript
JavaScript中解决多浏览器兼容性23个问题的快速解决方法
May 19 Javascript
浅谈jQuery hover(over, out)事件函数
Dec 03 Javascript
工作中常用的js、jquery自定义扩展函数代码片段汇总
Dec 22 Javascript
使用gulp构建前端自动化的方法示例
Dec 25 Javascript
微信小程序实现批量倒计时功能
Nov 01 Javascript
js点击事件的执行过程实例分析【冒泡与捕获】
Apr 11 Javascript
解决ie img标签内存泄漏的问题
Oct 13 #Javascript
jq源码解析之绑在$,jQuery上面的方法(实例讲解)
Oct 13 #jQuery
vue2组件之select2调用的示例代码
Oct 12 #Javascript
vue2.x select2 指令封装详解
Oct 12 #Javascript
一个简易时钟效果js实现代码
Mar 25 #Javascript
微信小程序实现页面跳转传值的方法
Oct 12 #Javascript
微信小程序 页面滑动事件的实例详解
Oct 12 #Javascript
You might like
Base64在线编码解码实现代码 演示与下载
2011/01/08 PHP
thinkPHP框架动态配置用法实例分析
2018/06/14 PHP
filemanage功能中用到的common.js
2007/04/08 Javascript
javascript showModalDialog 多层模态窗口实现页面提交及刷新的代码
2009/11/28 Javascript
jquery实现的一个导航滚动效果具体代码
2013/05/27 Javascript
二叉树的非递归后序遍历算法实例详解
2014/02/07 Javascript
JS实现兼容性较好的随屏滚动效果
2015/11/09 Javascript
JS采用绝对定位实现回到顶部效果完整实例
2016/06/20 Javascript
jquery实现自适应banner焦点图
2017/02/16 Javascript
浅谈vue中改elementUI默认样式引发的static与assets的区别
2018/02/03 Javascript
JavaScript禁用右键单击优缺点分析
2019/01/20 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
2019/02/02 Javascript
React 全自动数据表格组件——BodeGrid的实现思路
2019/06/12 Javascript
微信小程序-可移动菜单的实现过程详解
2019/06/24 Javascript
vue导航栏部分的动态渲染实例
2019/11/01 Javascript
Nest.js散列与加密实例详解
2021/02/24 Javascript
Tensorflow中的dropout的使用方法
2020/03/13 Python
基于Python的身份证验证识别和数据处理详解
2020/11/14 Python
python实现录制全屏和选择区域录屏功能
2021/02/05 Python
Html5新标签datalist实现输入框与后台数据库数据的动态匹配
2017/05/18 HTML / CSS
美国最大的城市服装和运动鞋零售商:Jimmy Jazz
2016/11/19 全球购物
DJI大疆无人机官方商城:全球领先的无人飞行器研发和生产商
2016/12/21 全球购物
Java语言程序设计测试题判断题部分
2013/01/06 面试题
工程造价专业大学生自荐信
2013/10/01 职场文书
教育孩子心得体会
2014/01/01 职场文书
小学生读书感言
2014/02/12 职场文书
致接力运动员广播稿
2014/02/17 职场文书
2014年六一儿童节演讲稿
2014/05/23 职场文书
股指期货心得体会
2014/09/13 职场文书
教师四风问题对照检查材料
2014/09/26 职场文书
2015年社区民政工作总结
2015/04/21 职场文书
简短清晨问候语
2015/11/10 职场文书
七年级语文教学反思
2016/03/03 职场文书
高中优秀作文(范文)
2019/08/15 职场文书
使用pandas或numpy处理数据中的空值(np.isnan()/pd.isnull())
2021/05/14 Python
python中urllib包的网络请求教程
2022/04/19 Python