JavaScriptの条件式を短く書くコツ！論理演算子の短絡評価を活用しよう

1. 論理演算子とは？

1. 論理演算子とは？

JavaScriptの論理演算子にはAND（&&）とOR（||）があります。ANDは両方の条件が真（true）の場合に全体が真になります。ORはどちらか一方が真であれば全体が真になります。

これらは「複数の条件をまとめて判断するための基本的な仕組み」で、if文や条件分岐で頻繁に使われます。特にJavaScriptでは、単にtrueやfalseだけでなく、値そのものを返す特徴があり、これがコードの短縮につながります。

let a = true;
let b = false;

console.log(a && b); // 両方trueでないとfalse
console.log(a || b); // どちらかtrueならtrue

false
true

このように、ANDは「両方OKか？」、ORは「どちらかOKか？」を判断するために使います。まずはこの基本ルールを理解しておくことで、後の短絡評価の仕組みもスムーズに理解できるようになります。

2. AND（&&）を使った短縮条件

2. AND（&&）を使った短縮条件

例えば、変数userが存在する場合だけメッセージを表示したいときに、通常はif文を使います。

if (user) {
  console.log("ユーザーが存在します");
}

ユーザーが存在します

この書き方は基本としてとても大切ですが、処理がシンプルな場合は少しだけ短く書くこともできます。そこで活用できるのがAND（&&）による短絡評価です。

user && console.log("ユーザーが存在します");

ユーザーが存在します

&&は「左側がtrueのときだけ右側を実行する」という動きをします。つまり、userが存在しているときだけconsole.logが実行されます。

初心者の方は「if文を省略した書き方」と覚えると理解しやすいです。例えば次のように、条件がfalseの場合は何も表示されません。

let user = null;

user && console.log("ユーザーが存在します");

このように、条件が満たされたときだけ処理を実行したい場面で、コードを短くシンプルに書けるのが特徴です。ただし、複雑な処理や複数行の処理を書く場合は、無理に1行にせずif文を使う方が読みやすくなります。

3. OR（||）を使ったデフォルト値設定

3. OR（||）を使ったデフォルト値設定

OR演算子を使うと、変数に値が入っていないときに「代わりの値（デフォルト値）」を簡単に設定できます。初心者の方でもよく使う、とても便利な書き方です。

let userName = null;
let name = userName || "ゲスト";
console.log(name);

ゲスト

||は「左側が使える値ならそれを使い、使えない場合は右側を使う」という動きをします。ここではuserNameがnullなので、代わりに"ゲスト"が表示されます。

もう一つ例を見てみましょう。値が入っている場合は、そのまま使われます。

let userName = "山田";
let name = userName || "ゲスト";
console.log(name);

山田

このように、入力値があるかどうかをチェックしながら、初期値や表示名を設定したいときに役立ちます。特にフォーム入力やユーザー名表示などでよく使われる基本テクニックです。

4. 関数内での短絡評価活用例

4. 関数内での短絡評価活用例

関数内でも短絡評価はとても便利に使えます。特に「値があるときだけ処理したい」という場面で、シンプルに書けるのが特徴です。例えば、ログインユーザーが存在するときだけメッセージを表示するケースを見てみましょう。

function showMessage(user) {
  user && console.log(user.name + "さん、こんにちは！");
}

showMessage({name: "太郎"});
showMessage(null);

太郎さん、こんにちは！

このコードでは、userが存在する場合のみ右側の処理が実行されます。nullやundefinedのときは処理がスキップされるため、エラーを防ぐことができます。

初心者の方は「値があるときだけ実行する安全な書き方」と覚えると理解しやすいです。特にAPIから取得したデータや、入力フォームの値を扱うときなど、データが存在するか不明な場合に役立ちます。

function printEmail(user) {
  user && user.email && console.log(user.email);
}

printEmail({email: "test@example.com"});
printEmail({});

test@example.com

このように複数の条件をつなげることで、「プロパティがある場合のみ処理する」といった安全なコードも書けます。関数の中で無駄なエラーを防ぎながら、短く分かりやすく書けるのが短絡評価の大きなメリットです。

5. 短絡評価のベストプラクティス

5. 短絡評価のベストプラクティス

• 簡単な条件式や一時的な処理は短絡評価で1行にまとめる
• 複雑な処理は無理に1行にせずif文で明示的に書く
• ORを使ったデフォルト値の設定は、初期値を分かりやすく示す
• ANDを使った実行は、条件が真の場合だけ処理したいときに活用
• 可読性を優先し、他の人が見ても理解できる書き方を心がける

短絡評価を理解して使いこなすことで、JavaScriptの条件式を簡潔で読みやすく書くことができます。

この記事を読んだ人からの質問

この記事を読んだ人からの質問

プログラミング初心者からのよくある疑問／質問を解決します

JavaScriptの条件式を短く書く方法として短絡評価とは何ですか？初心者向けに分かりやすく教えてください。

JavaScriptの短絡評価とは、論理演算子ANDやORを使って条件式の結果が途中で確定した場合、それ以上の評価を行わない仕組みです。これにより無駄な処理を省き、コードを短く書けるため、初心者でも効率的なJavaScriptコードを書くことができます。

JavaScriptの論理演算子ANDとORの違いは何ですか？条件式の書き方も知りたいです。

JavaScriptの論理演算子ANDは両方の条件がtrueのときだけ成立し、ORはどちらか一方がtrueなら成立します。この違いを理解することで、条件式を短く書くテクニックとして短絡評価を活用できるようになります。