こんにちは!フロントエンドの現場で長年コードと向き合っていると、ふとした瞬間に「これって本当にPromiseなのかな?」と迷う場面に出くわします。
JavaScriptの世界へようこそ。Promiseという「未来の約束」を扱う仕組みは非常に便利ですが、いざ判定しようとすると、意外と奥が深くて厄介なやつなんです。今日は、そんなPromiseの正体をどうやって見極めるか、現場の知恵をギュッと詰め込んでお話ししますね。
—
そもそも「Promise」って何者?
想像してみてください。あなたはカフェで注文をして、店員さんから「番号札」を渡されました。この番号札は、まだコーヒーではないけれど、「後でコーヒーが手に入るという約束」ですよね。
JavaScriptにおける `Promise` もこれと全く同じです。今すぐ答えは出ないけれど、あとで結果を届けてくれる「予約券」のようなものです。
この「予約券(Promise)」を判定する時、初心者がやりがちなのが `typeof` を使うこと。でも、これには罠があるんです。
罠:typeofの限界
const myPromise = new Promise(resolve => resolve(“できた!”));
// 試しに typeof してみると…?
console.log(typeof myPromise); // “object” と返ってくる
そう、`typeof` では「オブジェクト(箱)」であることしかわかりません。これだと、ただの `{}`(空のオブジェクト)と区別がつかないんです。これでは困りますよね。
—
1. 「thenable」という考え方(緩い判定)
現場では、ガチガチに「これぞPromise!」と決めつけるよりも、「君、thenメソッド持ってる? じゃあ君はPromiseみたいなもんだね!」と判断することが多いです。これを「thenable(ゼン・エイブル)」と呼びます。
例えるなら、「コーヒーチケットの半券を持っていれば、それはもうコーヒーを交換できる資格があるよね」という考え方です。
function isThenable(value) {
// 値がオブジェクトか関数であり、かつ .then が関数であるかを確認
return (
value !== null &&
(typeof value === ‘object’ || typeof value === ‘function’) &&
typeof value.then === ‘function’
);
}
const fakePromise = {
then: (resolve) => resolve(“偽物だけど、thenはあるよ”)
};
console.log(isThenable(fakePromise)); // true
この判定は、「他のライブラリが作ったPromiseっぽいもの」も受け入れられるので、実務では非常によく使われます。
—
2. 「これぞ本物!」を厳密に判定する方法
もし、「外部の怪しいデータではなく、正真正銘の `Promise` インスタンスであること」を保証したいなら、`instanceof` を使うのが王道です。
ただし、これには一つだけ注意点があります。「iframe(別のウィンドウ)」をまたぐと、判定に失敗することがあるんです。ブラウザの別々の部屋で育ったPromiseは、血縁関係(クラスの定義)が違うとみなされてしまうことがあるからですね。
でも、通常のWeb開発ならこれで十分です!
const p = new Promise(r => r());
// instanceof を使うと、クラスの継承関係まで含めて厳密に確認できる
if (p instanceof Promise) {
console.log(“間違いなく本物のPromiseです!”);
}
—
結局、現場ではどうすればいいの?
結論から言うと、「その値がPromiseかどうかわからない時は、とりあえず `Promise.resolve()` に包む」のが、最も賢くて安全なテクニックです。
これが最強の「おまじない」です。
async function handleValue(value) {
// valueがPromiseならそのまま、そうでなければPromiseに変換してくれる
const result = await Promise.resolve(value);
console.log(“中身を取り出せました:”, result);
}
// Promiseじゃないただの数字を入れても、ちゃんと動く!
handleValue(42);
// Promiseを入れても、もちろん動く!
handleValue(Promise.resolve(“本物です”));
最後に、あなたへ伝えたいこと
JavaScriptの型判定は、一見すると「厳密にルールを決めること」が正義のように思えるかもしれません。でも、現場では「いかに柔軟に、かつ安全にデータを扱うか」が重要です。
`Promise.resolve()` を使えば、相手が「本物のPromise」か「ただの文字列」かなんて気にせず、同じリズムで処理を繋げることができます。これこそが、JavaScriptの泥臭くも美しい「柔軟性」なんです。
最初は迷って当然です。うまくいかないときは「あ、この子はPromiseじゃなかったんだな」と優しく気づいてあげてください。その繰り返しが、あなたのコードを少しずつ、強く、しなやかにしていきますよ。
大丈夫、一緒に一つずつ学んでいきましょう!

コメント