プログラミングをする際には、条件に応じて処理を分岐することが頻繁にあります。JavaScriptでは、if
文を使うことが一般的ですが、もっとコンパクトに条件分岐を記述できる方法があります。それが三項演算子です。このブログでは、三項演算子を使いこなすためのテクニックとそのユースケースについて解説します。
三項演算子とは?
三項演算子(または条件演算子)は、JavaScriptにおける唯一の三項演算子で、以下の構文を持ちます。
condition ? expr1 : expr2
- condition: 条件式を記述する場所。真偽値を返す必要があります。
- expr1:
condition
がtrue
のときに実行される式。 - expr2:
condition
がfalse
のときに実行される式。
基本的な例
簡単な例を見てみましょう。以下は、天気に応じて持っていく物を決定する例です。
const weather = '晴れ';
const item = weather === '雨' ? '傘を持っていく' : '帽子を持っていく';
console.log(item); // "帽子を持っていく"
この例では、weatherが「雨」の場合は「傘を持っていく」、それ以外の場合は「帽子を持っていく」という結果を返します。
三項演算子の利点
三項演算子を使う主な利点は、その簡潔さと可読性にあります。
コードが短くなる
三項演算子を使うと、if
文を使うよりもコードがコンパクトになります。シンプルな条件分岐を行う場合に特に有効です。
const isMember = true;
let discount;
if(isMember ) {
discount = 10;
} else {
discount = 0;
}
これが
const isMember = true;
let discount = isMember ? 10 : 0;
このようにスッキリと書けます。
インラインで使用可能
三項演算子は、変数の初期化や関数の引数など、インラインで条件分岐を行いたい場合に便利です。
function getGreeting(isMorning) {
return isMorning ? 'おはようございます' : 'こんにちは';
}
可読性が向上することも
短くシンプルな条件分岐の場合、if
文よりも三項演算子の方が読みやすいことがあります。
特に、短い式で完結する条件分岐では、コードがスッキリするメリットがあります。
三項演算子のデメリット
可読性が低下する場合がある
三項演算子はシンプルな場合に便利ですが、条件が複雑になったり、ネストしたりするとコードの可読性が大きく低下します。
const result = score > 90 ? 'A' : score > 80 ? 'B' : score > 70 ? 'C' : 'F';
デバッグが難しい
三項演算子を多用すると、エラーが発生した際にどの部分で問題が生じているのか特定しにくくなります。特にネストされた場合、デバッグが煩雑になります。
条件が増えると冗長になる
三項演算子はシンプルな条件には向いていますが、条件が増えるとコードが冗長になりがちです。結果として、かえって見づらいコードになってしまう可能性があります。
表現力に限界がある
三項演算子は基本的に「ある条件が真ならばA、偽ならばB」といった単純なロジックにしか対応できません。
複数の操作や複雑な条件を含む場合は、if
文や他の制御構造の方が適していることが多いです。
三項演算子の活用例
ユーザーの役割によるアクセス権限の設定
const userRole = 'admin';
const accessLevel = userRole === 'admin' ? 'フルアクセス' : '制限付きアクセス';
console.log(accessLevel); // "フルアクセス"
商品の在庫状況に基づくラベル表示
const stock = 0;
const label = stock > 0 ? '在庫あり' : '在庫なし';
console.log(label); // "在庫なし"
三項演算子とif文の使い分け
三項演算子が向いているケース
- シンプルな条件分岐
- インラインで結果を返したい場合
- 簡潔な表現が求められるとき
if文が向いているケース
- 複雑な条件や複数行に渡る処理が必要な場合
- 可読性を重視したい場合
- デバッグやメンテナンスが必要な場合
まとめ
三項演算子は、条件分岐をシンプルに書くための強力なツールです。ただし、すべての状況において最適というわけではありません。利点を活かしつつ、デメリットにも注意して適切な場面で使い分けることが重要です。
ポイント
- 短く書けるが、複雑さに注意: シンプルな条件では三項演算子が効果的ですが、複雑なロジックでは
if
文を選びましょう。 - デバッグしやすさも考慮: ネストされた三項演算子は避け、わかりやすいコードを心がけることが重要です。
この記事が、三項演算子を適切に活用する助けとなり、より洗練されたJavaScriptコードを書く一助となれば幸いです。