JavaScriptの演算子一覧!比較・論理演算子の使い方をマスター

JavaScriptのプログラミングにおいて、値の計算や比較、条件の分岐を行うために欠かせないのが「演算子」です。演算子を正しく理解することは、プログラムのロジック(論理)を組み立てるための基礎となります。
この記事では、JavaScriptでよく使われる基本的な演算子を網羅し、特に重要な比較演算子と論理演算子の使い方について詳しく解説します。
Contents
JavaScriptの演算子とは
演算子とは、値(オペランド)に対して何らかの処理を行うための記号です。例えば、足し算を行う「+」や、値を代入する「=」などがあります。
JavaScriptには用途に応じてさまざまな演算子が用意されています。まずは全体像を把握するために、主な演算子の種類を一覧で確認します。
演算子の主な種類一覧
| 演算子の種類 | 役割 | 具体例 |
| 算術演算子 | 四則計算や余りの計算を行う | +, -, *, /, % |
| 代入演算子 | 変数に値を代入・追加する | =, +=, -= |
| 比較演算子 | 2つの値を比較して正しいか判定する | ==, ===, >, < |
| 論理演算子 | 複数の条件を組み合わせる(かつ、または) | &&, ` |
これらの演算子を組み合わせることで、複雑な条件分岐やデータ処理が可能になります。 基本的な変数の取り扱いについては、JavaScriptの変数宣言(let, const, var)の使い分け方法で詳しく解説しています。
算術演算子と代入演算子の基本
まずは、数値の計算や変数への代入を行う、最も基本的な2つの演算子をおさらいします。
算術演算子(四則計算)
数学の計算と同じように、足し算、引き算、掛け算、割り算などを行います。
// 算術演算子の使用例
const basicMath = () => {
const price = 1000;
const taxRate = 0.1;
const tax = price * taxRate; // 掛け算: 100
const total = price + tax; // 足し算: 1100
const jpyToUsd = total / 150; // 割り算
const remainder = 10 % 3; // 剰余(余り): 1(10割る3の余り)
const power = 2 ** 3; // べき乗: 8(2の3乗)
console.log(`合計金額: ${total}円, 余り: ${remainder}, べき乗: ${power}`);
};
basicMath();代入演算子
右辺の値を左辺の変数に代入します。「+=」などの複合代入演算子を使うと、現在の変数の中身に対して計算を加えながら再代入することができます。
// 代入演算子の使用例
const assignmentPractice = () => {
let score = 10;
score += 5; // score = score + 5 と同じ(15になる)
score -= 3; // score = score - 3 と同じ(12になる)
score *= 2; // score = score * 2 と同じ(24になる)
console.log(`最終スコア: ${score}`);
};
assignmentPractice();比較演算子の使い方
比較演算子は、2つの値を比較するために使用します。比較した結果は、正しい場合は true(真)、間違っている場合は false(偽)という 論理値(Boolean) で返されます。
主に if 文などの条件分岐と組み合わせて使用されます。条件分岐の基本構造については、JavaScriptのif文による条件分岐の基礎と応用を参照してください。
一致・不一致を判定する演算子
| 演算子 | 意味 | 判定の基準 |
=== | 厳密等価演算子 | 値とデータ型の両方が等しい場合に true |
== | 抽象等価演算子 | データ型を自動変換し、値が等しい場合に true |
!== | 厳密不等価演算子 | 値またはデータ型が等しくない場合に true |
!= | 抽象不等価演算子 | データ型を自動変換し、値が等しくない場合に true |
重要な注意点
JavaScriptの実務においては、バグを防ぐために型まで厳密にチェックする ===(厳密等価演算子)の起動が推奨 されます。== は予期せぬ型変換を行うため、意図しない判定を生む原因になります。
// 等価演算子の比較例
const compareEquality = () => {
const num = 10;
const str = "10";
// 厳密等価(型も比較する)
console.log(num === str); // false (数値と文字列のため)
// 抽象等価(型を自動変換して比較する)
console.log(num == str); // true (文字列の10が数値に変換されるため)
// 厳密不等価
console.log(num !== str); // true (型が異なるため、等しくないと判定される)
};
compareEquality();大小を比較する演算子
数値などの大きさや順序を比較する演算子です。
| 演算子 | 意味 |
> | 左辺が右辺より大きい(未満) |
< | 左辺が右辺より小さい(超える) |
>= | 左辺が右辺以上(その値を含む) |
<= | 左辺が右辺以下(その値を含む) |
// 大小比較の例
const compareSize = () => {
const age = 20;
console.log(age > 20); // false (20は20より大きくない)
console.log(age >= 20); // true (20以上なので20を含む)
console.log(age <= 19); // false (19以下ではない)
};
compareSize();論理演算子の使い方
論理演算子は、複数の比較条件を組み合わせたり、条件を反転させたりする場合に使用します。「かつ(AND)」「または(OR)」「〜ではない(NOT)」の3つの概念があります。
3つの論理演算子一覧
| 演算子 | 読み方・意味 | 成立する条件 |
&& | 論理積(AND) | すべての条件が true のときだけ true |
! | 論理否定(NOT) | 条件の true と false を反転させる |
論理演算子のコード例
// 論理演算子による複数条件の判定例
const checkConditions = () => {
const hasReservation = true;
const age = 25;
// 【AND】予約があり、かつ20歳以上の場合
if (hasReservation && age >= 20) {
console.log("入場可能です。");
}
// 【OR】予約がある、または年齢が18歳以下の場合
const isTarget = hasReservation || age <= 18;
console.log(`対象フラグ: ${isTarget}`); // true
// 【NOT】予約がない場合(trueの反転なのでfalseになる)
if (!hasReservation) {
console.log("予約が確認できません。");
} else {
console.log("予約が確認できています。");
}
};
checkConditions();論理演算子の「短絡評価(ショートサーキット)」
JavaScriptの論理演算子には、結果が確定した時点で以降の評価を打ち切る「短絡評価」という性質があります。
A && B:Aがfalseの場合、Bの式は実行されず、Aの値がそのまま返されます。A || B:Aがtrueの場合、Bの式は実行されず、Aの値がそのまま返されます。
この性質を利用して、変数の初期値(デフォルト値)を設定する手法がよく使われます。データの種類や型について再確認したい場合は、JavaScriptの基本データ型と型変換のルールを合わせて確認してください。
// 短絡評価を利用した初期値設定の例
const greetUser = (userName) => {
// userNameが未定義(undefinedやnull)の場合に、右辺の文字列が代入される
const displayName = userName || "ゲスト";
console.log(`こんにちは、${displayName}さん`);
};
greetUser("山田"); // こんにちは、山田さん
greetUser(""); // こんにちは、ゲストさん(空文字はfalse扱いとなるため)まとめ
JavaScriptの演算子は、プログラムに判断をさせたり、データを加工したりするための土台です。
- 計算は 算術演算子 、値の更新は 代入演算子 を使用する
- 比較には型まで厳密にチェックする
===を標準として使う - 複雑な条件分岐は
&&(かつ) や||(または) で整理する
それぞれの演算子の特徴と評価のルールを意識することで、読みやすくバグの少ないコードを書くことができるようになります。まずは簡単な条件式から実際に手を動かして、動作を確かめてみてください。
関連記事
- JavaScriptの条件分岐(if文)とは?基本から解説
- JavaScriptのデータ型とは?基本から解説
- JavaScriptの変数宣言(let, const, var)の使い分け方法

