JavaScript - if文を1行で書いてみる

JavaScriptで「if文を1行で書く」といっても、①文字通り「if文」を1行で記述する方法と、 ②「if else文」を三項演算子（条件演算子）を使って1行で記述する方法があります。

ここでは両方の書き方と使用上の注意点について説明します。

「if文」を1行で記述する

次のようなif文があるとします。

if (a == 10){
	b = a;
}

このif文を1行で記述してみます。

「波括弧{}なし」の場合

「波括弧{}なし」の場合は次のようになります。

if (a == 10) b = a;

「波括弧{}あり」の場合

「波括弧{}あり」の場合は次のようになります。

if (a == 10) {b = a;}

後者の場合、波括弧{} の後にセミコロン(;)をつけないようにしてください。

文の終わりにはセミコロンを付けますが、ブロックの終わりにはセミコロンは付けません。

関連記事: 波括弧（中括弧）{}で囲まれたブロックの注意点

「if else文」を三項演算子（条件演算子）を使って1行で記述する

「if else文」

次のサンプルコードは、「if else文」を使って「変数a」が奇数か偶数かを判定します。

if (a % 2 == 0){
	str = "偶数";
} else{
	str = "奇数"
}

三項演算子（条件演算子）

三項演算子はオペランド（被演算子）を３つ取るという意味です。

「?」と「:(コロン)」を使って記述します。

三項演算子（条件演算子）の構文は次の通りです。

条件式 ? 条件式がtrue時の式 : 条件式がfalse時の式

上の「if else文」を三項演算子（条件演算子）で記述すると次のようになります。

if (a % 2 == 0){
	str = "偶数";
} else{
	str = "奇数"
}

  ↓↓↓

(a % 2 == 0) ? str = "偶数" : str = "奇数";

また、次のように記述することもできます。

str = (a % 2 == 0) ? "偶数" : "奇数";

同じ変数（この場合は変数str）に値を代入する場合は、 後者の書き方の方がシンプルになります。

三項演算子（条件演算子）のまとめ

このように、三項演算子（条件演算子）を使って「if else文」を1行で書くことも出来ます。

ですが、初心者のうちは、素直に「if else文」を使った方がわかりやすいと思います。

慣れてきたら三項演算子（条件演算子）を使う方法も試してみてください。