JavaScript 速習チュートリアル

JavaScript の論理演算子

1. 論理演算子(Logical Operators)

論理演算子は、複数のブーリアン式(Boolean expressions)を組み合わせるために使用されます。 これらを利用することで、比較演算の結果をさらに加工したり、複数の条件を統合して複雑なロジックを構築したりすることが可能になります。

1.1 JavaScript 論理演算子の一覧

以下の表は、x = 6 および y = 3 と仮定した場合の各演算子の挙動を示しています。

演算子名称結果
&&AND(論理積)(x < 10 && y > 1)true
||OR(論理和)(x === 5 || y === 5) false
!NOT(論理否定)!(x === y)true

2. 各演算子の詳細

2.1 JavaScript 論理 AND (&&)

&& 演算子は、両方の式true の場合にのみ true を返し、それ以外の場合は false を返します。

let x = 6;
let y = 3;
// 両方の条件が満たされているため z は true になる
let z = (x < 10 && y > 1);

2.2 JavaScript 論理 OR (||)

|| 演算子は、いずれか一方、または両方の式true の場合に true を返し、両方とも false の場合にのみ false を返します。

let x = 6;
let y = -3;
// x > 0 が true であるため、全体の評価結果 z は true になる
let z = (x > 0 || y > 0);

2.3 JavaScript 論理 NOT (!)

! 演算子は、ブーリアンの値を反転させます。false の式に対しては true を返し、true の式に対しては false を返します。

let x = (5 == 8);   // x は false
let y = !(5 == 8);  // false の否定なので y は true

3. Null 合体演算子 (??)

?? 演算子(Nullish Coalescing Operator)は、左側のオペランドNullish(null または undefined) の場合にのみ右側のオペランドを返し、それ以外の場合は左側のオペランドを返します。

3.1 使用例

let name = null;
let text = "名前が未入力です";
let result = name ?? text;
// name が null のため、result には "名前が未入力です" が代入される

3.2 なぜ Null 合体演算子が必要なのか?

プログラミングにおいて、0 や空文字("")、falseNaN などはすべて Falsy(偽として評価される値)として扱われます。
しかし、現実のアプリケーション開発では「空文字や 0 は有効な値として受け入れ、nullundefined の場合のみデフォルト値にフォールバックしたい」というケースが多々あります。このような場合に ?? を使用することで、より厳密な判定が可能になります。

4. ブラウザのサポート状況

?? 演算子は ES2020 で導入された機能です。
現在、すべてのモダンブラウザにおいて完全にサポートされています。

ブラウザバージョンサポート開始時期
Chrome852020年8月
Edge852020年8月
Firefox792020年3月
Safari142020年9月
Opera712020年9月