JavaScript - if文を省略してコードをシンプルにする

JavaScriptでif 文を省略して書く方法がいくつかあります。

ここでは、条件式(true/false)を省略する方法、行数や波括弧を省略する方法、 三項演算子（条件演算子）を使って1行で記述する方法を紹介します。

if文の条件式(true/false)を省略する

条件式において、ある変数が true か false かを判断する場合は、 下のような省略した書き方がよく使われます。

true を省略

// 省略しない書き方
if (judge == true) {
	a = 0;
}

// 省略時
if (judge) {
	a = 0;
}

false を省略

// 省略しない書き方
if (judge == false) {
	a = 0;
}

// 省略時
if (!judge) {
	a = 0;
}

この条件式(true/false)を省略する方法は、 よく見かけますし、よく使います。ぜひ使いこなしてください。

if文の行数や波括弧を省略する方法

次のような複数にわたる行を省略して書くことができます。

// 省略しない書き方
if (a == 0) {
	b = 1;
}

1行で記述する

// 1行で記述する
if (a == 0) { b = 1; }

1行で記述し、波括弧を省略

文が1文の場合は、波括弧を省略することができます。

// 1行、かつ波括弧を省略
if (a == 0) b = 1;

上であげた3つの if 文はどれも同じ意味です。

自分や読む人がわかりやすい方法で記述してください。

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

三項演算子（条件演算子）は「?」と「:（コロン）」を使い、 次のように記述します。

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

通常の if 文と、三項演算子（条件演算子）を使った場合の違いを見てみます。

// 省略しない書き方
if (a == b) {
	c = 1;
} else {
	c = 2;
}

三項演算子（条件演算子）を使った場合

上の if 文は、三項演算子を使って次のように記述できます。

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

(a == b) ? c = 1 : c = 2;

//又は次のようにも記述できます。

c = (a == b) ? 1 : 2;

式がシンプルな場合は、三項演算子を使って省略した方が見やすくなる場合があります。

でも、式がシンプルでない場合は、 三項演算子を使うとコードがわかりにくくなる場合があります。

その辺は状況に応じて使い分けてください。