真偽値の変換
真偽値の変換 とは
Boolean / !! / truthy・falsy を理解して値を真偽値に変換する。本レッスンでは、真偽値の変換 の基本から実際の使いどころまでを整理し、現場で迷わず使える形に落とし込みます。
真偽値の変換
JavaScript では if 文や論理演算子に 任意の値 を渡すことができ、その値が真とみなされる (truthy) か偽とみなされる (falsy) かを内部で判定します。この性質を理解しておくと、条件分岐のコードがすっきりします。本レッスンでは Boolean() 関数と !! 二重否定演算子で値を真偽値に変換し、truthy/falsy のルールを覚えます。
ポイント
if (value)と書いたとき、valueは実はBoolean(value)に通されているのと同じ意味になります。
falsy な値は 7 つだけ
まず「偽 と判定される値」を全部覚えてしまうのが近道です。次の 7 つだけが falsy で、それ以外はすべて truthy です。
false0および-00n(BigInt の 0)""(空文字列)nullundefinedNaN
逆に "0" (文字列のゼロ) や [] (空配列)、{} (空オブジェクト) は truthy です。これは初学者が引っかかりやすいところなので意識しましょう。
JavaScript
console.log(Boolean(0)); // false
console.log(Boolean("")); // false
console.log(Boolean(null)); // false
console.log(Boolean(undefined));// false
console.log(Boolean(NaN)); // false
console.log(Boolean("0")); // true (文字列なので truthy)
console.log(Boolean([])); // true (オブジェクトなので truthy)
console.log(Boolean({})); // true注意
Boolean("false")はtrueです。中身が空文字でない限り文字列は truthy です。
Boolean 関数と !!
明示的に真偽値へ変換する方法は 2 つあります。1 つは Boolean(value) で、もう 1 つは !!value です。どちらも結果は同じで、好みの問題ですが、Boolean(value) のほうが読み手にとっては意図が明確です。!! は ! を 2 回付ける ことで「否定の否定 = そのままの真偽値」を作る伝統的なテクニックです。
JavaScript
const raw = "hello";
console.log(Boolean(raw)); // true
console.log(!!raw); // true
const empty = "";
console.log(Boolean(empty)); // false
console.log(!!empty); // false動きを図で追う
Boolean(value) がどう判定するかを図にすると次のとおりです。
ヒント 「falsy は 7 種類だけ」を呪文として覚えると、判定で迷いません。
よくある間違い
1 つ目は "false" (文字列) を Boolean("false") に通したら false が返ると誤解するパターンです。中身が空でない文字列はすべて truthy なので true になります。文字列の "false" を boolean に変換したいなら value === "true" のように明示比較が必要です。2 つ目は配列やオブジェクトの中身が空でも truthy であることです。空かどうかは arr.length === 0 や Object.keys(obj).length === 0 で判定します。3 つ目は Boolean(null) と null === false を混同するケース。null は false ではなく、緩い比較でも厳密比較でも null == false は false です。
注意 truthy/falsy の判定と「等しいか」の判定は別物です。
実務での使いどころ
if (user) のようにオブジェクトの存在チェックでよく使います。user が null や undefined のときだけ falsy になり、それ以外の {} { id: 1 } などはすべて truthy なので、null ガードがすっきり書けます。また、フォーム入力の必須チェックで if (!input.value) と書くと、空文字や null を一括ではじけます。
補足 厳密に「空オブジェクトを弾きたい」場合は
Object.keys(obj).length > 0で別途判定します。
やってみよう
値を 1 つ受け取り、その値が truthy なら true、falsy なら false を返す関数 isTruthy を作ってください。やることはシンプルで、Boolean(value) の結果を返すだけです。テストケースには文字列、数値、配列、オブジェクト、null など多様な値が含まれています。すべてのケースで期待値と一致するか確認しましょう。
よくある質問
Q. ブラウザと Node.js で動作は変わりますか?
A. JavaScript の構文・組み込み機能(配列・文字列・Promise 等)はどちらでも同じです。違いは DOM API(ブラウザ専用)と fs などのファイル系(Node 専用)など、実行環境固有の機能です。コアロジックは両方で動くため、テストもしやすくなります。
Q. ES6 以降の新機能は使っても大丈夫ですか?
A. 現代のブラウザ・Node.js は ES2020 以降の機能をほぼサポートしています。古い IE 等を対象にする必要が無ければ、let/const、アロー関数、分割代入、async/await を積極的に使ってください。トランスパイル(Babel/Vite)が必要なケースは年々減っています。
Q. TypeScript に進む価値はありますか?
A. 型情報があるとリファクタやエディタ補完が劇的に効くため、規模が大きくなるなら TypeScript への移行を強くおすすめします。最初は any を許容しつつ徐々に型を付ければ、JS の知識をそのまま活かせます。
次のレッスン
次は null と undefined を見分ける で、Boolean / !! / truthy・falsy を理解して値を真偽値に変換する を学びます。
事前確認 — 進む前に次の 3 つができることを確認しましょう。
- 真偽値変換 の要点を自分の言葉で説明できる
- このレッスンの最小コード (または操作手順) を見ずに書ける
- 練習問題やクイズで間違えた箇所を読み直して理解した
理解度チェック (30 秒)
Q. 真偽値変換 とは何か、1 文で説明してください。
A. 本文の「このレッスンで分かること」または冒頭の説明文を見直し、自分の言葉で要約できれば OK。詰まったら本レッスンの最初の H2 セクションを読み返してみましょう。
関連レッスン
要件
- Boolean 関数または !! で真偽値に変換する
- falsy な 7 種類で false を返す
- それ以外の値で true を返す
入出力例
test-cases.txt
isTruthy("hello") → true
isTruthy("") → false
isTruthy(0) → false
isTruthy(1) → true
isTruthy(null) → false
isTruthy([]) → true
isTruthy({}) → true