This page was translated from English by the community. Learn more and join the MDN Web Docs community.

Promise.prototype.catch()

catch() メソッドは Promise を返しますが、拒絶された場合のみ扱います。 Promise.prototype.then(undefined, onRejected) の呼び出しと同じ動作をします (実際、 obj.catch(onRejected) の呼び出しは内部的に obj.then(undefined, onRejected) を呼び出しています)。つまり、返値を undefined にフォールバックしたい場合でも、 onRejected 関数を提供する必要があります。 - 例えば、 obj.catch(() => {}) のようにします。

構文

p.catch(onRejected);

p.catch(function(reason) {
   // rejection
});

引数

onRejected
Promise が失敗した時に呼び出される Function です。この関数は一つの引数を持ちます。
reason
拒絶された理由です。
catch() で返される Promise は、 onRejected がエラーを発生させた場合、または返される Promise それ自体が拒絶された場合は、拒絶となります。それ以外の場合は、解決となります。

返値

内部的には、呼び出されたオブジェクトの Promise.prototype.then を呼び出し、引数に undefined と、受け取った onRejected ハンドラーを渡します。返値はこの呼び出しの値であり、すなわち Promise です。

なお、以下の例は Error のインスタンスを投げます。これは文字列を投げる場合と比較して、良い習慣と見なされています。そうでなければ、キャッチを実行する部分で引数が string か error かをチェックする必要があり、スタックトレースのような価値のある情報を失う可能性があります。

内部呼び出しの例

// overriding original Promise.prototype.then/catch just to add some logs
(function(Promise){
    var originalThen = Promise.prototype.then;
    var originalCatch = Promise.prototype.catch;

    Promise.prototype.then = function(){
        console.log('> > > > > > called .then on %o with arguments: %o', this, arguments);
        return originalThen.apply(this, arguments);
    };
    Promise.prototype.catch = function(){
        console.error('> > > > > > called .catch on %o with arguments: %o', this, arguments);
        return originalCatch.apply(this, arguments);
    };

})(this.Promise);



// calling catch on an already resolved promise
Promise.resolve().catch(function XXX(){});

// logs:
// > > > > > > called .catch on Promise{} with arguments: Arguments{1} [0: function XXX()]
// > > > > > > called .then on Promise{} with arguments: Arguments{2} [0: undefined, 1: function XXX()]

解説

catch メソッドは複合したプロミスの複合のエラー処理に使用されます。これは Promise を返しますので、姉妹メソッドである then() と同様の方法でチェーン可能です。

例

catch メソッドの使用とチェーン化

var p1 = new Promise(function(resolve, reject) {
  resolve('Success');
});

p1.then(function(value) {
  console.log(value); // "Success!"
  throw new Error('oh, no!');
}).catch(function(e) {
  console.error(e.message); // "oh, no!"
}).then(function(){
  console.log('after a catch the chain is restored');
}, function () {
  console.log('Not fired due to the catch');
});

// 以下は、上記と同様に動作します
p1.then(function(value) {
  console.log(value); // "Success!"
  return Promise.reject('oh, no!');
}).catch(function(e) {
  console.error(e); // "oh, no!"
}).then(function(){
  console.log('after a catch the chain is restored');
}, function () {
  console.log('Not fired due to the catch');
});

エラーを投げたことを知る

// Throwing an error will call the catch method most of the time
var p1 = new Promise(function(resolve, reject) {
  throw new Error('Uh-oh!');
});

p1.catch(function(e) {
  console.error(e); // "Uh-oh!"
});

// Errors thrown inside asynchronous functions will act like uncaught errors
var p2 = new Promise(function(resolve, reject) {
  setTimeout(function() {
    throw new Error('Uncaught Exception!');
  }, 1000);
});

p2.catch(function(e) {
  console.error(e); // This is never called
});

// Errors thrown after resolve is called will be silenced
var p3 = new Promise(function(resolve, reject) {
  resolve();
  throw new Error('Silenced Exception!');
});

p3.catch(function(e) {
   console.error(e); // This is never called
});

解決される場合

//Create a promise which would not call onReject
var p1 = Promise.resolve("calling next");

var p2 = p1.catch(function (reason) {
    //This is never called
    console.error("catch p1!");
    console.error(reason);
});

p2.then(function (value) {
    console.log("next promise's onFulfilled"); /* next promise's onFulfilled */
    console.log(value); /* calling next */
}, function (reason) {
    console.log("next promise's onRejected");
    console.log(reason);
});

仕様書

仕様書
ECMAScript (ECMA-262)
Promise.prototype.catch の定義

ブラウザーの互換性

BCD tables only load in the browser

関連情報