【サクッと解説】JavaScriptの演算子を整理

2025年8月5日

1. 本記事のポイント

JavaScriptにおける基本的な演算子（+ – * / %）の動作を整理
比較演算子（== と ===）の違いと設計意図を解説
型変換を伴う暗黙的な挙動の注意点も補足

2. JavaScriptの演算子とは？

JavaScriptには、数値の計算や値の比較に使用される演算子が多数用意されています。
代表的な算術演算子には +, -, *, /, % があり、比較演算子には == と === が含まれます。

特に ==（抽象的等価）と ===（厳密な等価）は混同されやすく、暗黙の型変換の有無が挙動に大きく影響します。

これらの演算子は日常的な業務コードに頻出するため、動作仕様を正確に理解しておくことは実装の信頼性向上に直結します。
また、型変換や浮動小数点の仕様も絡むため、注意深い設計判断が求められます。

3. 詳細解説

数値演算子（+、-、*、/、%）

以下は基本的な数値演算子の使用例です。

JavaScript

const a = 10;
const b = 3;

console.log(a + b);  // 13
console.log(a - b);  // 7
console.log(a * b);  // 30
console.log(a / b);  // 3.333...
console.log(a % b);  // 1（剰余）

const a = 10;
const b = 3;

console.log(a + b);  // 13
console.log(a - b);  // 7
console.log(a * b);  // 30
console.log(a / b);  // 3.333...
console.log(a % b);  // 1（剰余）

これらの演算子はすべて左から右への順で評価され、演算対象は両辺が数値であることが前提です。

+ 演算子と文字列連結の注意点

+ は数値演算だけでなく、文字列連結にも使われます。型によって挙動が変わります。

JavaScript

console.log(1 + 2);         // 3（数値）
console.log('1' + 2);       // "12"（文字列）
console.log(1 + '2');       // "12"（文字列）

console.log(1 + 2);         // 3（数値）
console.log('1' + 2);       // "12"（文字列）
console.log(1 + '2');       // "12"（文字列）

片方が文字列の場合、JavaScriptは暗黙的にもう一方を文字列化して連結します。
意図しない結果を防ぐには、明示的な型変換を行うのが安全です。

比較演算子（== と === の違い）

== は暗黙の型変換を行い、=== は型と値の両方を比較します。

JavaScript

console.log(1 == '1');   // true（型変換が行われる）
console.log(1 === '1');  // false（型が異なるため）

console.log(1 == '1');   // true（型変換が行われる）
console.log(1 === '1');  // false（型が異なるため）

実務では原則として === を使用するのが安全です。
これは意図しない型変換によるバグを防ぐためで、ESLintなどの静的解析ツールでも == は警告対象になります。

NaN や null/undefined との比較

特殊な比較結果を返すケースもあります。

JavaScript

console.log(NaN === NaN);       // false（NaNは常に自身と等しくない）
console.log(null == undefined); // true（==では等しい）
console.log(null === undefined);// false（型が異なる）

console.log(NaN === NaN);       // false（NaNは常に自身と等しくない）
console.log(null == undefined); // true（==では等しい）
console.log(null === undefined);// false（型が異なる）