在es6的承诺中，'。catch（rejection）'等于'.then（null，rejection）'？

Question

首先，请看这个演示。

 function loadImageAsync(url) { return new Promise(function(resolve, reject) { var image = new Image(); image.src = url; // onload 在对象已加载时触发image.onload = resolve; // onerror 在文档或图像加载过程中发生错误时被触发image.onerror = reject; }) } var someImgEle = document.getElementById("imgEle"); var url = someImgEle.dataset.src loadImageAsync(url).then(function() { someImgEle.src = url; someImg.style.display = "block"; // error will be printed }).catch(function() { console.log("error") throw new Error('couldnt load image' + url); }) /* loadImageAsync(url).then(function(){ someImgEle.src = url; someImg.style.display = "block"; // error will be not printed },function () { console.log("error") throw new Error('couldnt load image' + url); }) */ 

 <img id="imgEle" src="" data-src="http://omizt4opc.bkt.clouddn.com/avatar.jpg" alt=""> 

在这个演示中，我认为无法打印“错误”。 事实伤害了我。

最近，我正在通过网址学习Promise。

但这个演示似乎与此相矛盾。

我糊涂了。

Answer 1

如果你使用catch ：

.catch(function() {
  console.log("error")
  throw new Error('couldnt load image' + url);
})

在图像加载和内部success回调期间发生的错误：

  someImgEle.src = url;
  someImg.style.display = "block";
  someImg.accessUndefinedProperty.oneLevelMore; // TypeError: Cannot read property 'oneLevelMore' of undefined

将被抓住。

如果使用error callback而不是catch子句，则只会catch图像加载期间的错误。 一般推荐是使用catch而不是错误回调。

更新：

在您的特定情况下，您在此处有错误：

someImg.style.display = "block";

由于someImg ，因此执行catch块。 您只需在catch块中传递error对象即可检查错误：

.catch(function(error) {
                ^^^^^

这个特例说明了为什么catch优先于error callback 。

Answer 2

.catch(rejection)等于.catch(rejection) .then(null,rejection) ？

是。 而且不只是等于，它甚至在以下方面实现then 。

然而：

 loadImageAsync(url).then(function(){ // error here will be printed }).catch(function() { console.log("error") }) loadImageAsync(url).then(function(){ // error here will be not printed }, function () { console.log("error") }) 

那很准确。 .then(…).catch(…)和.then(…).catch(…) .then(…, …)不相等 。