当前位置:首页 > 日记 > 正文

捕获未处理的Promise错误方法

捕获未处理的Promise错误方法

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

使用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错误方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

相关文章

如何在word中插入封面

如何在word中插入封面

封面,如何在,电脑软件,word,  有时候在word文档中需要好看的封面,但是我们又不知道怎么弄,那就选择在word里面寻找吧,在下面就由小编给大家分享下在word中添加封面的技巧,希望能帮助到您。在word中添加封面的步骤如下:  步骤一:选择需要插入…

photoshop简单制作漂亮的翡翠立体

photoshop简单制作漂亮的翡翠立体

文字,漂亮,简单,电脑软件,photoshop,今天小编就为大家介绍怎样用photoshop制作漂亮的翡翠立体文字方法,推荐到,喜欢的朋友可以参考本文,希望能对大家有所帮助!1、打开你的ps软件,新建一个800*600., 72像素的文件。2、打上你想要做的文字。我这里…

ps中性灰商业人像后期精修教程

ps中性灰商业人像后期精修教程

教程,人像,后期,电脑软件,ps,后期思路:主要使用“中性灰”对人物的皮肤进行修饰、立体化的强化以及五官的修饰。毛发,眼珠也是重点。效果对比:经过后期精修之后,效果简单的呈现出来,放一张对比图,做完之后发现颌骨的位置有所瑕疵。教程…

PS滤镜高反差怎么处理?

PS滤镜高反差怎么处理?

滤镜,反差,怎么处理,电脑软件,PS,ps怎么使用高反差滤镜呢?我们举一个简单的例子来看看这个滤镜的效果,详细内容请看下文详细介绍。软件名称:Adobe photoshop 7.01 官方正式简体中文版软件大小:154MB更新时间:2013-04-191、打开一个PS的软件,然后…

angularjs中的$eval方法详解

angularjs中的$eval方法详解

方法,详解,电脑软件,angularjs,eval,在controller中定义了一个变量$scope.a_1 = "abc";想在view里面动态输出,因为这个数字是动态的,这么输出肯定是不行的{{'a_' + '1'}},因为输出来的是a_1这个字符串,而不是a_1这个变量的值想输出a_1这…

JavaScript判断浏览器和hack滚动条

JavaScript判断浏览器和hack滚动条

滚动条,浏览器,写法,电脑软件,JavaScript,判断各大浏览器内核:var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = userAgent.indexOf("Opera") > -1; …

在wps文字中设置水印的方法

在wps文字中设置水印的方法

方法,文字,设置,自定义,水印,  在自己辛苦完成的文字中,希望加上自己独特的标记。在wps文字中的水印就可以起到这种作用。下面小编教你怎么在wps文字中设置水印,希望对你有帮助!wps文字中设置水印的方法第一步:单击【文件】--【打开】命令,打…

bootstrap 模态框(modal)实现水平垂

bootstrap 模态框(modal)实现水平垂

水平垂直居中,显示,模态框,电脑软件,bootstrap, 众所周知,bootstrap是一款非常实用的CSS框架(主要用于样式的快速搭建),由于其简洁,美观,快捷,响应式等特点备受大家喜欢,但是其本身也是存在很多bug,当应对与具体的业务逻辑的时候往往达不到细…

js CSS3实现卡牌旋转切换效果

js CSS3实现卡牌旋转切换效果

效果,卡牌,电脑软件,js,我们经常会在游戏里看到一些几张卡牌左右切换的效果,中间的一张最突出醒目,向左或向右滑动可切换到另一张,今天我们就用CSS3来实现下这种效果。我们先来看个demo,具体的样式各位可以自己调整:(PC下可点击按钮切换,移动端可…

ES6中javascript实现函数绑定及类

ES6中javascript实现函数绑定及类

函数绑定,事件绑定,详解,功能,电脑软件,本文实例讲述了ES6中javascript实现函数绑定及类的事件绑定功能的方法。分享给大家供大家参考,具体如下:函数绑定箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法(call、apply、bind)。但是,箭…

JavaScript中清空数组的三种方式

JavaScript中清空数组的三种方式

数组,三种,清空,方式,电脑软件,方式1,splicevar ary = [1,2,3,4]; ary.splice(0,ary.length); console.log(ary); // 输出 [],空数组,即被清空了 方式2,length赋值为0 这种方式很有意思,其它语言如Java,其数组的length是只读的,不能被赋值。如int[…

Vue.js自定义指令的用法与实例解析

Vue.js自定义指令的用法与实例解析

自定义指令,实例,电脑软件,Vue,js,市面上大多数关于Vue.js自定义指令的文章都在讲语法,很少讲实际的应用场景和用例,以致于即便明白了怎么写,也不知道怎么用。本文不讲语法,就讲自定义指令的用法。自定义指令是用来操作DOM的。尽管Vue推崇数据…