算術演算子を一言でいうと
算術演算子（さんじゅつえんざんし）は、
数値に対して「足し算・引き算・掛け算・割り算・余り」を行うための記号 です。
JavaScript では次の 5 つが基本になります。
+ 足し算- 引き算* 掛け算/ 割り算% 剰余（余り）
ここが重要です。
この 5 つを「数値に対してちゃんと使いこなせるか」は、プログラミングの“計算力”の土台になります。
特に %（余り）は、最初はイメージしにくいですが、条件分岐や繰り返しでよく使う超重要なパーツです。
足し算：+ 演算子（ただし「文字列結合」との違いは要注意）
数値同士ならふつうの足し算
const a = 5;
const b = 3;
const result = a + b;
console.log(result); // 8
ふつうの算数と同じく、5 + 3 = 8 です。
複数重ねても同じです。
console.log(1 + 2 + 3); // 6
数値と文字列が混ざると「文字列結合」に変わる
ここが JavaScript の注意点です。
console.log(1 + 2); // 3（数値の足し算）
console.log("1" + 2); // "12"（文字列結合）
console.log(1 + "2"); // "12"（文字列結合）
console.log("1" + "2"); // "12"（文字列結合）
どこか 1 つでも文字列が混ざると、+ は「足し算」ではなく「文字列をくっつける記号」 として動きます。
例えば、合計金額を計算しているつもりが、実は文字列になっているケースはよくあります。
const price = "100"; // 文字列として受け取ってしまった
const tax = 10;
console.log(price + tax); // "10010"（110 にしたかったのに…）
この場合は、Number(price) や parseInt(price, 10) で数値にしてから足す必要があります。
ここが重要です。+ は「数値の足し算」と「文字列結合」の両方を担当している。
「今この値は本当に number なのか？ string になってないか？」を意識して使うことが大事 です。
引き算：- 演算子（文字列にはならない）
数値同士の引き算
const a = 10;
const b = 4;
const result = a - b;
console.log(result); // 6
マイナス（負の数）も普通に扱える
console.log(5 - 10); // -5
console.log(-3 - 7); // -10
正の数、負の数、どちらも普通に扱えます。
文字列が混ざっても「数値として解釈しようとする」
- は + と違い、
「文字列結合」という意味を持ちません。
console.log("10" - 1); // 9
console.log(10 - "1"); // 9
文字列 "10" や "1" が「数値として解釈できる」場合は、
自動的に数値に変換されてから計算されます。
ただし、数字でない文字列だと NaN（Not a Number）になります。
console.log("hello" - 1); // NaN
ここが重要です。-、*、/、% は「文字列結合モード」にはならないため、
「数字っぽい文字列」を渡すと自動で数値に変換しようとする という挙動をします。
賢いようでいて、バグの元にもなるので、本来は自分でしっかり数値に変換してから使うほうが安全です。
掛け算：* 演算子
基本的な使い方
const a = 4;
const b = 3;
const result = a * b;
console.log(result); // 12
複数重ねても同じです。
console.log(2 * 3 * 4); // 24
小数との掛け算
console.log(1.5 * 2); // 3
ただし、JavaScript の数値は「浮動小数点数」なので、
たとえば 0.1 * 0.2 のような計算では誤差が出ることがあります。
console.log(0.1 * 0.2); // 0.020000000000000004 など
これは JavaScript 特有ではなく、多くの言語で共通する「浮動小数点の限界」です。
割り算：/ 演算子（整数同士でも小数になる）
基本的な割り算
const a = 10;
const b = 4;
const result = a / b;
console.log(result); // 2.5
重要なのは、
整数同士の割り算でも結果は小数になり得る という点です。
console.log(5 / 2); // 2.5
0 で割るとどうなるか
console.log(10 / 0); // Infinity（無限大という特殊値）
console.log(-10 / 0); // -Infinity
console.log(0 / 0); // NaN（数ではない）
0 で割るのは数学的に定義できないので、Infinity や NaN という特殊な値になります。
ここが重要です。
JavaScript の / は「整数除算」ではなく「実数としての割り算」。
結果が小数になることを前提にしておく必要があります。
「整数部分だけ欲しい」場合は、Math.floor などと組み合わせます。
例えば、「3 で割ったときの商だけ欲しい」場合：
const n = 10;
const quotient = Math.floor(n / 3); // 3
console.log(quotient);
剰余（余り）：% 演算子（超重要）
剰余を一言でいうと
a % b は、
「a を b で割ったときの“余り”」 を返します。
console.log(10 % 3); // 1（3×3=9, 余り1）
console.log(10 % 2); // 0（2×5=10, 余り0）
奇数・偶数判定の定番パターン
% の代表的な使い道が「奇数・偶数チェック」です。
const n = 7;
if (n % 2 === 0) {
console.log("偶数です");
} else {
console.log("奇数です");
}
n % 2 が
0 → 2 で割り切れる → 偶数
1 → 2 で割り切れない → 奇数
と判断できます。
周期的な処理に使える
例えば、「1,2,3,1,2,3,1,2,3…」というパターンを作りたいとき。
for (let i = 1; i <= 10; i++) {
const v = i % 3;
console.log(i, "→", v);
}
ここで i % 3 は 0,1,2,0,1,2,… と循環します。
0 がイヤなら i % 3 + 1 とすれば 1,2,3,1,2,3,… になります。
ここが重要です。% は「余り」だけでなく、「周期」「繰り返しパターン」を作るのにめちゃくちゃ役立つ演算子です。
インデックスのローテーションや、“n 回ごとに何かをする”といったロジックで頻出します。
演算子の優先順位（どの順番で計算されるか）
掛け算・割り算が足し算・引き算より先
算数と同じで、
掛け算（*）・割り算（/）・剰余（%）
が
足し算（+）・引き算（-）
より先に計算されます。
console.log(1 + 2 * 3); // 7
// 先に 2 * 3 = 6 → 1 + 6 = 7
かっこ () を使えば優先順位を変えられる
console.log((1 + 2) * 3); // 9
// 先に 1 + 2 = 3 → 3 * 3 = 9
「どの順番で計算してほしいか分かりやすくするために、かっこを使う」 のはとても大事です。
ここが重要です。
優先順位を丸暗記するより、少しでも迷ったらかっこで明示する。
「自分はこう計算してほしい」とコードに書いてあげることで、未来の自分や他人にも優しいコードになります。
型と算術演算子の関係で気を付けること
NaN（Not a Number）に注意
数値として扱えない文字列を算術演算子に渡すと、NaN（数ではない）になります。
console.log("abc" * 2); // NaN
console.log("10px" - 1); // NaN
NaN は何と計算しても NaN のまま広がるので、
早めに気付くことが大切です。
明示的な変換を心がける
ユーザー入力など、元が文字列のことが分かっているものは、
ちゃんと数値に変換してから計算するのが安全です。
const input = "100"; // 文字列
const num = Number(input); // 数値に変換
const result = num + 20;
console.log(result); // 120
ここが重要です。
算術演算子は、相手が number 型であることを前提に使う。
“数字っぽい文字列” が相手なら、暗黙の変換に頼るのではなく、自分でちゃんと Number(…) する習慣をつけると、バグが激減します。
初心者として本当に押さえてほしいポイント
+ は「数値の足し算」と「文字列結合」の両方に使われる。
文字列が混ざると結合になるので、計算したいときは型に注意する。
-、*、/、% は基本的に数値演算。
文字列は自動で数値に変換しようとするが、数字でないと NaN になる。
/ は整数同士でも小数になる（整数除算ではない）。% は「余り」を返し、奇数・偶数判定や周期的な処理でとてもよく使う。
掛け算・割り算・余りが、足し算・引き算より先に計算される。
迷うときはかっこ () で明示的に順番を指定する。
ここが重要です。
「これは本当に number 同士で計算しているか？」「+ が足し算として動いているか？」「% の余りの意味をちゃんとイメージできているか？」
この 3 つを意識して練習していくと、算術演算子まわりのバグはかなり減ります。
よければ次のような小さな練習をしてみてください。
const a = 7;
const b = 3;
console.log(a + b); // ?
console.log(a - b); // ?
console.log(a * b); // ?
console.log(a / b); // ?
console.log(a % b); // ?
// 奇数・偶数チェック
for (let i = 0; i <= 10; i++) {
const kind = i % 2 === 0 ? "偶数" : "奇数";
console.log(i, "は", kind);
}
自分で結果を予想してから実行してみると、
「足し算・引き算・掛け算・割り算・余り」の感覚が、かなりしっかり身体に入ってきます。
