thenの中でエラーを投げるには?(onRejectedな状態にするには?)
- このような処理の時、もしかしたらthen(onFullfilledな状態)の中で例外を飛ばしたい場合があるかもしれません。
const fn = () => {
return new Promise((resolve) => {
setTimeout(() => {
console.log('setTimeout done');
resolve();
}, 500);
});
};
fn().then(() => {
console.log('fn done');
});
// 実行結果
// setTimeout done
// fn done
- そういう時どうするのって話です。
方法としては二つ
throw
const fn = () => {
return new Promise((resolve) => {
setTimeout(() => {
console.log('setTimeout done');
resolve();
}, 500);
});
};
fn().then(() => {
console.log('fn done');
throw new Error('error message');
}).catch(err => {
console.log(err.message);
});
// setTimeout done
// fn done
// error message
reject
const fn = () => {
return new Promise((resolve) => {
setTimeout(() => {
console.log('setTimeout done');
resolve();
}, 500);
});
};
fn().then(() => {
console.log('fn done');
return Promise.reject(new Error('error message'));
}).catch(err => {
console.log(err);
});
// setTimeout done
// fn done
// error message
- thenの中で
throw
するか新たなPromise
を返すかというだけの変更です。 - では、どちらの方がいいのでしょうか。
- ちなみに
Promise.reject
はnew Promise((reject) => { reject() });
の省略記法です。
結論: rejectしよう
- rejectしましょう。
なぜか
- 理由としては、
- それが意図して投げられた例外か本当に発生した例外かわからないから です。
- Google開発者ツールのデバッグ機能で確認すると、
- 意図的か本当の例外か関係なく
break
してしまいます。 - つまり、不要なところで
break
が発生し、 - 後続の処理が追えなくなります。
- こうなるとデバッガーの意味を成さなくなりますよね。
- 意図を明確にするためにも、
- デバッグ機能をうまく使いこなすためにも
-
then
の中でエラーを投げたい
時は -
reject
しましょう。