Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【ITニュース解説】Day 4 of Complete JavaScript in 17 days | Visual Series📚✨

2025年09月20日に「Dev.to」が公開したITニュース「Day 4 of Complete JavaScript in 17 days | Visual Series📚✨」について初心者にもわかりやすく解説しています。

作成日: 更新日:

ITニュース概要

JavaScriptには、真と見なされる「Truthy」と偽と見なされる「Falsy」という値の概念がある。OR演算子`||`は最初のTruthy値を返し、AND演算子`&&`は最初のFalsy値を返す。この特性を理解すると、条件分岐や値のデフォルト設定を効率的に記述できる。

ITニュース解説

JavaScriptを学ぶ上で非常に重要な概念の一つに、「Truthy(トゥルーシー)」と「Falsy(ファルシー)」がある。これは、明示的にtruefalseと書かれていない値でも、JavaScriptが文脈に応じて「真(true)」とみなしたり「偽(false)」とみなしたりする、という特性を指す。この特性は、プログラムの条件分岐や値のデフォルト設定など、様々な場面で活用されるため、システムエンジニアを目指す上で必ず理解しておくべき基礎知識だ。

まず、Falsyな値とは何か。JavaScriptにおいてFalsyと判断される値は、次の6種類に限定される。

  1. 0:数値のゼロ
  2. "":空の文字列
  3. null:値が存在しないことを示す特別な値
  4. undefined:値が割り当てられていない変数などの状態
  5. NaN:数値ではないことを示す特別な値(Not a Number)
  6. false:論理値の偽

これら以外のすべての値は、Truthyな値と判断される。例えば、空ではない文字列(例: "Azaan", "0")、空の配列[]、空のオブジェクト{}、任意の数値(0以外)などはすべてTruthyな値である。これは一見すると直感と異なるかもしれないが、JavaScriptの設計思想によるものだ。

このTruthyとFalsyの概念は、論理演算子である||(OR演算子)と&&(AND演算子)の挙動を理解する上で不可欠となる。これらの演算子は、単にtrueまたはfalseを返すだけでなく、評価の結果としてオペランド(演算子の対象となる値)そのものを返すという特徴を持っている。

||(OR演算子)について見てみよう。この演算子は、左側のオペランドから順に評価していき、最初にTruthyな値を見つけたら、その値を返し、それ以降の評価は行わない。もし左側の値がFalsyであれば、右側の値を評価し、その値を返す。

例えば、const firstName = ""; const nickName = "Azzu"; console.log(firstName || nickName);というコードがある。ここでfirstNameは空文字列""なのでFalsyと判断される。そのため、||演算子は右側のnickNameを評価する。nickNameは文字列"Azzu"なのでTruthyであり、この値が結果として返され、出力はAzzuとなる。これは、「もしfirstNameが何も入っていなければ、代わりにnickNameを使う」というような、デフォルト値を設定したい場面で非常に役立つ。

さらに、複数の||演算子を連結することも可能だ。let fname = ""; let mname = undefined; let lname = null; console.log(fname || mname || lname);の例では、fnameは空文字列でFalsy、mnameundefinedでFalsyと評価されるため、次にlnameが評価される。lnamenullでFalsyなので、結局nullが返される。この場合、すべてのオペランドがFalsyだったため、最後に評価されたlnameの値(null)が返されることになる。

この特性は、環境変数の設定など、プログラムが外部から値を受け取る際に非常に便利に使われる。例えば、const PORT = process.env.PORT || 5000;という記述は、「もし環境変数PORTが設定されていればその値を使用し、設定されていなければデフォルト値として5000を使用する」という意味になる。process.env.PORTundefined(Falsy)であれば5000が使われ、"3000"のような値(Truthy)が設定されていればそれが使われる。

また、NaN(Not a Number)についても触れておこう。let a = 12; let b; console.log(a + b);という例では、bは初期化されていないためundefinedとなる。数値の12undefinedを足し算しようとすると、結果は有効な数値ではなくNaNとなる。NaNもFalsy値の一つであることを覚えておくと良い。このような状況を避けるためには、先ほどの||演算子を活用できる。console.log(c + (d || 0));のように記述すれば、もしdundefinedのようなFalsy値であれば0が使われ、結果として12 + 012が出力される。

次に&&(AND演算子)を見てみよう。この演算子は、左側のオペランドから順に評価していき、最初にFalsyな値を見つけたら、その値を返し、それ以降の評価は行わない。もしすべてのオペランドがTruthyだった場合は、最後に評価された(一番右の)オペランドの値を返す。

例えば、let f_name_1 = "Azaan"; let f_name_2 = ""; let ans = f_name_1 && f_name_2; console.log(ans);というコードがある。まずf_name_1は文字列"Azaan"なのでTruthyと判断される。次にf_name_2が評価され、これは空文字列""なのでFalsyと判断される。&&演算子はここでFalsyな値を見つけたため、その値である""を返し、これ以降の評価は行われない。したがって、出力は空文字列となる。

もう一つの例、let f_name_3 = "Azaan"; let f_name_4 = null; let ans2 = f_name_3 && f_name_4; console.log(ans2);の場合も同様だ。f_name_3はTruthyだが、次に評価されるf_name_4null(Falsy)であるため、nullが返される。

このように、||&&は、単なる真偽判定だけでなく、実際に値そのものを返すという点で非常に強力な機能を持っている。特に、TruthyとFalsyの概念を理解していれば、これらの演算子をより柔軟に、そして効率的にプログラムに組み込むことができる。JavaScriptのコードを書く上で、条件分岐やデフォルト値の設定、あるいは特定の条件が満たされた場合にのみ処理を実行する、といった場面でこれらの知識は頻繁に応用される。システムエンジニアとして効率的で堅牢なコードを書くためには、これらの基本的な特性をしっかりと押さえておくことが不可欠である。特に、異なる値が混在する可能性のある状況で、意図した通りの挙動をさせるために、このTruthyとFalsyの振る舞いを深く理解することが求められる。

関連コンテンツ