JavaScript falsyな値の完全リストとtruthy判定

あらゆる値には真偽の「気分」がある

JavaScript では、真偽値が期待される場所に どんな値でも 置けます。if の中でも、while の条件でも、&& や || の隣でもOKです。そこに値を置くと、自動的に true か false に変換されます。false に変換される値を falsy、それ以外の値はすべて truthy と呼びます。

if ("hello") console.log("文字列は truthy です");
if (42) console.log("0 以外の数値は truthy です");
if ([]) console.log("空の配列は truthy です");
if ({}) console.log("空のオブジェクトは truthy です");

if (!0) console.log("0 は falsy です");
if (!"") console.log("空文字列は falsy です");

変換関数も明示的なキャストも不要で、JavaScript が自動でやってくれます。ルールは小さくて固定されているので、falsy な値さえ覚えてしまえば、あとは全部その裏返しで説明がつきます。

falsy 値の完全リスト

falsy になる値はきっかり7つ。それ以外は言語内のすべてが truthy です。

const falsyValues = [false, 0, -0, 0n, "", null, undefined, NaN];

for (const v of falsyValues) {
    console.log(v, "->", Boolean(v));
}

これだけです。リストはこう:

• false — 真偽値そのもの。
• 0 と -0 — どちらのゼロも。
• 0n — BigInt のゼロ。
• "" — 空文字列（シングル・ダブル・バッククォート、どれでも同じ）。
• null — 「意図的に何もない」ことを表す値。
• undefined — 「まだセットされていない」値。
• NaN — 0 / 0 のような無効な計算の結果。

この7つを覚えてください。あとは判定に迷う値が出てきたら、「この7つのどれかに当てはまる？」と自問するだけ。当てはまらなければ truthy です。

意外と truthy なやつら: "0"、[]、{}

ここで初心者はだいたいハマります。_見た目は_空っぽでも truthy な値はけっこうあるんです:

console.log(Boolean("0"));       // true — 空ではない文字列だから
console.log(Boolean("false"));   // true — これも空ではない文字列
console.log(Boolean(" "));       // true — スペースもカウントされる
console.log(Boolean([]));        // true — 空配列はオブジェクト
console.log(Boolean({}));        // true — 空オブジェクトはオブジェクト
console.log(Boolean(new Date()));// true

文字列が falsy になるのは、文字数がゼロのときだけです。"0" は1文字あるので truthy 扱いになります。配列とオブジェクトは、中身が空でも必ず truthy です。JavaScript ではこれらをオブジェクトとして扱い、オブジェクトは中身にかかわらずすべて truthy になるからです。

Python から来た人にとっては、ここが一番戸惑うポイントかもしれません。Python では [] や {} は falsy ですが、JavaScript では違います。

「空かどうか」を正しく判定する方法

[] や {} は truthy なので、if にそのまま渡して空判定に使うことはできません。次のように明示的に書きましょう。

const items = [];
const user = {};

// 誤り — 常に実行される:
if (items) console.log("items に中身がある");

// 正しい:
if (items.length === 0) console.log("items は空");
if (Object.keys(user).length === 0) console.log("user にフィールドなし");

文字列の場合も、空白だけの文字列を「空」として扱いたいなら次のようにします。

const input = "   ";
if (input) console.log("真を示すが、実際には役に立たない");
if (input.trim() === "") console.log("実際には空");

Truthy / Falsy はあくまで便利な省略記法であって、「データにとって "空" とは何か」をきちんと考える作業の代わりにはなりません。

本物の Boolean に変換する

truthy っぽい値ではなく、本当の true / false が欲しい場面もあります。定番のイディオムは次の2つです。

const name = "Rosa";

console.log(Boolean(name));  // true
console.log(!!name);         // true

const empty = "";
console.log(Boolean(empty)); // false
console.log(!!empty);        // false

Boolean(x) が明示的な真偽値への変換で、!!x はその短縮記法です。最初の ! で真偽値に変換しつつ反転させ、2つ目の ! でもう一度反転して元に戻す、という仕組みですね。どちらもよく使われます。!! の方が短く書けますが、Boolean() の方が意図は読み取りやすいです。

関数からきれいな真偽値を返したいときの return 文で、!! をよく見かけます。

function hasItems(arr) {
    return !!arr && arr.length > 0;
}

console.log(hasItems([1, 2]));   // true
console.log(hasItems([]));        // false
console.log(hasItems(null));      // false

&& と || における Truthy / Falsy

JavaScript の論理演算子は、実は true や false を返しているわけではありません。オペランド（被演算子）のどちらか一方をそのまま返します。どちらが返ってくるかは、値の truthy / falsy によって決まります。

console.log("a" && "b");       // "b"  — 両方truthyなので最後を返す
console.log(0 && "b");         // 0    — falsyな値で短絡評価
console.log("" || "代替");     // "代替" — 最初がfalsyなので2番目を返す
console.log("hi" || "代替");   // "hi"   — 最初がtruthyなのでそれを返す

これが value || defaultValue というデフォルト値のイディオムが広く使われる理由です。ただし落とし穴もあります。このパターンは すべての falsy な値を同じように扱ってしまうので、0 や "" のように本来は有効な入力であるはずの値まで弾かれてしまうのです。

function greet(name) {
    const who = name || "名無し";
    console.log("こんにちは、" + who);
}

greet("Ada");   // こんにちは、Ada
greet("");      // こんにちは、名無し — でも "" は意図的だったかも?
greet(0);       // こんにちは、名無し — そして 0 は有効な id かもしれない

null か undefined のときだけフォールバックしたい場合は、代わりに Null 合体演算子 ?? を使いましょう。こちらについては別のドキュメントで詳しく解説しています。

チートシート

// Falsy — 7つすべて:
Boolean(false);     // false
Boolean(0);         // false
Boolean(-0);        // false
Boolean(0n);        // false
Boolean("");        // false
Boolean(null);      // false
Boolean(undefined); // false
Boolean(NaN);       // false

// Truthy — それ以外のすべて:
Boolean("0");       // true
Boolean("false");   // true
Boolean([]);        // true
Boolean({});        // true
Boolean(() => {});  // true
Boolean(Infinity);  // true
Boolean(-Infinity); // true

印刷してモニターに貼り付けたら、あとは気にせず次に進みましょう。

次は: イテレータとジェネレータ

条件分岐とループをひと通り押さえたので、次の章では JavaScript が値を「必要なときに生成する」仕組みを見ていきます。イテレータとジェネレータは、for...of やスプレッド構文、さらには最近の多くの API を支えている縁の下の力持ちです。次章でじっくり取り上げます。