JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptの論理OR演算子（||）とは？使い方と動作の仕組みを解説

論理OR演算子（||）とは

JavaScriptにおける || は論理OR演算子と呼ばれるもので、2つのオペランド（被演算子）のうち、どちらか一方でも「真（truthy）」と評価される値であれば、条件全体が true になります。両方のオペランドが「偽（falsy）」である場合にのみ、結果は false となります。

基本的な動作

  • 左辺が truthy な値 → そのまま左辺の値を返す
  • 左辺が falsy な値 → 右辺の値を返す

この性質を利用すると、単なる条件判定だけでなく、「デフォルト値の設定」などにも活用できます。

コード例

以下は、|| 演算子をJavaScriptで使用する基本的な例です。

<html>
   <body>
      <script>
         var a = true;
         var b = false;

         document.write("(a || b) => ");
         result = (a || b);
         document.write(result);
      </script>
   </body>
</html>

このコードでは、a が true、b が false なので、a || b の評価結果は true となり、画面には次のように表示されます。

(a || b) => true

falsyな値に注意

JavaScriptでは、以下の値はすべて「falsy（偽とみなされる）」として扱われます。

  • false
  • 0（数値のゼロ）
  • ""（空文字列）
  • null
  • undefined
  • NaN

これら以外の値はすべて truthy と判断されます。たとえば 0 || "デフォルト" は "デフォルト" を返します。これは便利な一方、0 や空文字列を有効な値として扱いたい場合には意図しない動作を招くことがあるため注意が必要です。そのようなケースでは、ES2020で導入されたNull合体演算子（??）の利用を検討するとよいでしょう。

短絡評価（ショートサーキット）

|| 演算子は短絡評価を行います。つまり、左辺が truthy と判定された時点で右辺は評価されず、処理がスキップされます。これにより、不要な関数呼び出しや計算を回避できます。

// 左辺がtrueのため、右辺の関数は実行されない
let result = true || heavyProcess();

まとめ

|| 演算子は、どちらか一方のオペランドがtruthyであれば true を返す論理OR演算子です。条件分岐だけでなく、デフォルト値の代入や短絡評価による処理の最適化にも役立つ、JavaScriptの基本かつ重要な演算子です。

  1. JavaScriptの比較演算子「<（未満）」とは？意味と使い方を実例で解説

    JavaScriptにおける「<（未満）」は、比較演算子の一つです。左側のオペランドの値が右側のオペランドの値よりも小さいかどうかを判定し、条件が成立すれば true、成立しなければ false を返します。基本的な使い方例えば、「a < b」という式では、変数 a の値が変数 b の値より小さい場合に true となります。数値同士だけでなく、文字列や日付などの比較にも利用できます。サンプルコード以下のコードを実行すると、「<」演算子の動作を実際に確認できます。<html>    <body>       <

  2. JavaScriptのビットごとのOR（|）演算子とは？使い方をわかりやすく解説

    JavaScriptにおけるビットごとのOR（|）演算子は、2つの数値を2進数のビット列として比較し、対応するビットのどちらか一方でも「1」であれば結果として「1」を返す演算子です。両方のビットが「0」の場合のみ、結果は「0」になります。ビットOR演算の基本ルールビットごとのOR演算は、以下のようなルールで各ビットが評価されます。0 | 0 → 00 | 1 → 11 | 0 → 11 | 1 → 1サンプルコード以下のコードを実行すると、JavaScriptのビットごとのOR（|）演算子の動作を確認できます。この例では、「7」と「1」をOR演算しています。<!DOCTYPE html&