【ワンピースで覚えるJavaScript】間違いやすい真偽値５選 (入門者必見)

JavaScriptの真偽値で間違いやすいところを紹介します。

let onepiece = ""; 空文字
if (onepiece) {
     result.innerText = "ワンピースの正体を知っている";
} else {
     result.innerText = "ワンピースはまだ分からない";
}

=>ワンピースはまだ分からない

空文字は偽ですね。

let onepiece = "false";   falseという文字
if (onepiece) {
     result.innerText = "ワンピースの正体を知っている";
} else {
     result.innerText = "ワンピースはまだ分からない";
}

=>ワンピースの正体を知っている

falseでも文字列なら真です

let code_name = 0;    0という数値
if (code_name) {
     result.innerText = "正体はクロコダイル";

} else {
     result.innerText = "正体は不明!";
}
=>正体は不明!

０は偽です！

let code_name = 0/0;     NaNになる例
if (code_name) {
     result.innerText = "正体はクロコダイル";
} else {
     result.innerText = "正体は不明!";
}
=>正体は不明!

NaNも偽ですね！数値はこの２つです！！

let joy_boy = [];    空配列
if (joy_boy) {
     result.innerText = "ジョイボーイは存在";
} else {
     result.innerText = "ジョイボーイは架空";
}
=>ジョイボーイは存在

配列は空でも真

let joy_boy = {};    空のオブジェクト
if (joy_boy) {
     result.innerText = "ジョイボーイは存在";
} else {
     result.innerText = "ジョイボーイは架空";
}
=>ジョイボーイは存在

空オブジェクトも真

let joy_boy = {};    空のオブジェクト
if (Object.keys(joy_boy).length) {
     result.innerText = "ジョイボーイは存在";
} else {
     result.innerText = "ジョイボーイは架空";
}
=>ジョイボーイは架空

偽扱いしたい場合はlength を使う

let devil_fruits;    undefined
if (devil_fruits === false) {
     result.innerText = "悪魔の実は今だに謎";
} else {
     result.innerText = "悪魔の実のすべてが解明";
}
=>悪魔の実のすべてが解明

直接falseと比較しない

let devil_fruits;    undefined
if (!devil_fruits) {
     result.innerText = "悪魔の実は今だに謎";
} else {
     result.innerText = "悪魔の実のすべてが解明";
}
=>悪魔の実は今だに謎

一度trueやfalseに変換しよう！