【JavaScript】if文での値の判定についてまとめた（null・undefined・空文字など）

nullを判定する

if文でnullを判定してみましょう。

if(null) {
  console.log('true');
} else {
  console.log('false');
}

// 'false'

JavaScriptでは、nullをif文で判定するとfalseになります。

undefinedを判定する

if文でundefinedを判定してみましょう。

if(undefined) {
  console.log('true');
} else {
  console.log('false');
}

// 'false'

JavaScriptでは、undefinedをif文で判定するとfalseになります。

空文字「””」を判定する

if文で空文字「””」を判定してみましょう。

if("") {
  console.log('true');
} else {
  console.log('false');
}

// 'false'

JavaScriptでは、空文字「””」をif文で判定するとfalseになります。

文字列を判定する

if文で文字列を判定してみましょう。

if("moji") {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、空文字以外の文字列をif文で判定するとtrueになります。

空の変数を判定する

if文で定義しただけの空の変数を判定してみましょう。

let value;

if(value) {
  console.log('true');
} else {
  console.log('false');
}

// 'false'

JavaScriptでは、定義しただけの空の変数はundefinedとして扱われるため、if文で判定するとfalseになります。

let value;

console.log(value); // undefined

数値の0を判定する

if文で数値の0を判定してみましょう。

if(0) {
  console.log('true');
} else {
  console.log('false');
}

// 'false'

JavaScriptでは、数値の0をif文で判定するとfalseになります。

0以外の数値を判定する

if文で0以外の数値を判定してみましょう。

if(99) {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、0以外の数値をif文で判定するとtrueになります。

マイナスの数値や、小数値の場合もtureになるので覚えておくと良いでしょう。

if(-99) {
  console.log('true');
} else {
  console.log('false');
}
// 'true'

if(9.9) {
  console.log('true');
} else {
  console.log('false');
}
// 'true'

空の配列を判定する

if文で空の配列を判定してみましょう。

if([]) {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、 空の配列をif文で判定するとtrueになります。

要素を持つ配列を判定する

if文で要素を持つ配列を判定してみましょう。

if(['one', 'two', 'three']) {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、 要素を持つ配列をif文で判定するとtrueになります。

空のオブジェクトを判定する

if文で空のオブジェクトを判定してみましょう。

if({}) {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、 空のオブジェクトをif文で判定するとtrueになります。

要素を持つオブジェクトを判定する

if文で要素を持つオブジェクトを判定してみましょう。

if({ a: 'one', b: 'two'}) {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、 要素を持つオブジェクトをif文で判定するとtrueになります。

空の関数を判定する

if文で空の関数を判定してみましょう。

if(function(){}) {
  console.log('true');
} else {
  console.log('false');
}

// 'true'

JavaScriptでは、 空の関数をif文で判定するとtrueになります。

なお、何かしら処理を含む関数については、その処理によってreturnされる値が変わってきます。

まとめ

JavaScriptでは、if文で値を判定すると以下のようになります。

値	if文の判定
null	false
undefined	false
空文字「””」	false
文字列	true
空の変数	false
数値の0	false
0以外の数値	true
空の配列	true
要素を持つ配列	true
空のオブジェクト	true
要素を持つオブジェクト	true
空の関数	true