【さんこうえんざんし】

三項演算子 とは?

💡 「もしAならB、さもなくばC」を1行で書く速記法
📌 このページのポイント
三項演算子 vs if文 — 比較 if文(従来の書き方) if (age >= 18) {'{'} result = "成人"; {'}'} else {'{'} result = "未成年"; {'}'} 三項演算子(1行) result = age >= 18 条件 ? 真の値 : 偽の値 条件 ? 真のとき : 偽のとき シンプルな条件分岐を1行で書ける if-elseを簡潔に書ける演算子。可読性とのバランスが大切
三項演算子のイメージ
ひよこ ひよこ

三項演算子ってif文とどう違うの?

ペンギン先生 ペンギン先生

if文は「文」だから単体で使うけど、三項演算子は「式」なので値を返すんだ。だから「const message = age >= 18 ? '大人' : '子供';」のように代入の中で直接使える。if文で書くと4行かかるところが1行で済むのが魅力だよ。

ひよこ ひよこ

ReactのJSXでよく見かけるけど、なぜ?

ペンギン先生 ペンギン先生

JSXの中ではif文が使えないんだ(JavaScriptの式しか書けない)。だから条件によって表示を切り替えるときに三項演算子がぴったりなんだよ。「{isLoggedIn ? : }」みたいに、ログイン状態で表示するコンポーネントを切り替える、というのが典型的な使い方だね。

ひよこ ひよこ

おもしろい!三項演算子で気をつけることってある?

ペンギン先生 ペンギン先生

絶対にやってはいけないのが「三項演算子ネスト」だよ。「a ? b : c ? d : e ? f : g」みたいになると誰も読めなくなる。これは代表的なアンチパターンで、コードレビューで確実に指摘される。条件が2つ以上ならif-elseかswitch文を使おう。三項演算子は「シンプルな二択」専用だと思っておくのがいいよ。

ひよこ ひよこ

三項演算子がない言語ってあるの?

ペンギン先生 ペンギン先生

Pythonには「? :」形式の三項演算子はないけど、「value_if_true if condition else value_if_false」という独自の書き方がある。Rustではif式が値を返すから「let x = if a > 0 { a } else { -a };」と書ける。三項演算子がなくても代替手段があるから、言語設計者の哲学が反映されているんだよ。

ひよこ ひよこ

Null合体演算子(??)とは何が違うの?

ペンギン先生 ペンギン先生

三項演算子は「条件がtrueかfalseかで値を選ぶ」もの。Null合体演算子(??)は「左辺がnullまたはundefinedなら右辺を使う」もの。たとえばconst name = user.name ?? 'ゲスト'は、user.nameがnullやundefinedのときだけ'ゲスト'になる。三項演算子だとuser.name ? user.name : 'ゲスト'と書く必要があるから、??の方がスッキリするね。短絡評価の||との違いは、??は0や空文字をfalsyと見なさない点。これを知らないと地味にハマるポイントだよ。

ペンギン
まとめ:ざっくりこれだけ覚えればOK!
「三項演算子」って出てきたら「条件分岐を1行で書ける便利な省略記法だな」と思えればだいたいOK!
📖 おまけ:英語の意味
「ternary operator」 = 三つの項を取る演算子
💬 ternaryは「3つの」という意味。条件・真の値・偽の値の3つの項を取るからこう呼ばれるよ
← 用語集にもどる