当then方法返回的是一个新的Promise实例。catch方法无法捕捉新实例的错误
function loadImageAsync(url) {
return new Promise(function(resolve, reject) {
throw new Error('BUG FOREVER')
const image = new Image();
image.onload = function() {
resolve(image);
};
image.onerror = function() {
reject(new Error('Could not load image at ' + url));
};
image.src = url;
});
}
let src1='https://image.suning.cn/uimg/sop/commodity/213287247648868791262800_x.jpg'
let src2='https://image.suning.cn/uimg/sop/commodity/742303264420020864606900_x.jpg'
let img1=loadImageAsync(src1)
let img2=loadImageAsync(src2)
img1.then(function(img){
console.log('第一个图片 height='+img.height)
return img2
}).then(function(img){
console.log('第二个图片 width='+img.width)
}).catch(function(err){
console.log('fail'+err)
})
运行结果
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
未捕获的异常是这里抛出的
promise的构造器是同步的,只要你执行loadImageAsync方法就会立即抛出异常。
然而promise中的error比较特殊,它不会中断下面程序的运行,并且之后你还是可以catch到,比如说你setTimeout 2s后还是可以catch到。
我感觉这个现象还是挺特别的,不知道有哪位大佬能解释一下
==================分割线======================================
哈,构造器里面的异常应该是被promise吃掉了,并没有往上抛,但会提示,被控制台误导了。
let img1=loadImageAsync(src1)
let img2=loadImageAsync(src2)
此时,异常已经产生了,img1和img2的状态是rejected,所以他们俩会直接走catch
img1
抛出错误之后就不走then
了直接catch
没有走return img2
所以你的
img2
没有定义catch