JavaScriptの算術演算子の基本
はじめての人でもわかるように、JavaScriptの「計算のしかた」を例つきで説明します。コードはそのままブラウザの開発者ツールやオンラインエディタで試せます。
よく使う演算子と動作
足し算・引き算・掛け算・割り算・余り・べき乗
console.log(10 + 5); // 15（足し算）
console.log(10 - 5); // 5（引き算）
console.log(10 * 5); // 50（掛け算）
console.log(10 / 4); // 2.5（割り算）
console.log(10 % 3); // 1（余り）
console.log(2 ** 3); // 8（べき乗）
- %（余り）: 何回割り切れたかではなく「最後に残る数」。偶数・奇数判定に便利。
const n = 7; console.log(n % 2 === 0); // false（奇数） - べき乗
**: 2の3乗＝2×2×2。古い書き方はMath.pow(2, 3)。
文字列と数値が混ざるときの注意
console.log("Hello" + "World"); // "HelloWorld"（文字列を連結）
console.log(1 + "2"); // "12"（片方が文字列だと連結になる）
console.log(1 + Number("2")); // 3（数値に変換すれば足し算）
- ポイント:
+は「足し算」か「文字列連結」のどちらか。片方が文字列だと連結になる。 - 安全策: 入力が文字列なら
Number()で数値に変換してから計算する。
小数の誤差（これでつまずく人が多い）
console.log(0.1 + 0.2); // 0.30000000000000004（ちょっとズレる）
- なぜ: コンピュータは小数を2進数で表していて、きれいに表せない数があるため。
- 対策（よく使う2つ）:
- 丸める: 小数点以下を指定して文字列にし、必要なら数値に戻す。
- 整数にして計算: 100倍してから割る。
// 丸める: 小数点以下を指定して文字列にし、必要なら数値に戻す。
const sum = 0.1 + 0.2;
console.log(sum.toFixed(2)); // "0.30"（文字列）
console.log(Number(sum.toFixed(2))); // 0.3（数値）
// 整数にして計算: 100倍してから割る。
const a = 0.1, b = 0.2;
console.log((a * 100 + b * 100) / 100); // 0.3
便利な書き方（短くて読みやすい）
let x = 10;
// 1足す・1引く
x++; // x = 11
x--; // x = 10
// 足しながら代入（複合代入演算子）
x += 5; // x = 15
x -= 3; // x = 12
x *= 2; // x = 24
x /= 4; // x = 6
x %= 5; // x = 1
x **= 3; // x = 1（1の三乗）
- ポイント: 「右の計算をして左に入れる」を短く書ける。読みやすく、バグが減る。
実践例題（手を動かして慣れる）
例題1: 合計と平均を出す
const scores = [80, 90, 75];
const total = scores[0] + scores[1] + scores[2];
const average = total / scores.length;
console.log("合計:", total); // 245
console.log("平均:", average); // 81.6666666667...
console.log(Number(average.toFixed(1))); // 81.7（小数1桁に丸める）
- ポイント: 配列の要素を足して、件数（length）で割る。表示は丸めると見やすい。
例題2: 料金の端数処理（切り捨て）
const price = 1234; // 税抜
const taxRate = 0.1; // 10%
const withTax = price * (1 + taxRate); // 1357.4
const rounded = Math.floor(withTax); // 1357（1円未満切り捨て）
console.log(rounded);
- ポイント: お金は小数処理に注意。必要に応じて
Math.floor（切り捨て）、Math.ceil（切り上げ）、Math.round（四捨五入）を使う。
例題3: タイマー表示の整形（分と秒）
const totalSeconds = 367; // 6分7秒
const minutes = Math.floor(totalSeconds / 60);
const seconds = totalSeconds % 60;
const display = `${minutes}:${String(seconds).padStart(2, "0")}`;
console.log(display); // "6:07"
- ポイント: 60で割って「分」、余りが「秒」。表示は2桁に揃えると親切。
例題4: レベルアップの判定（余りでサイクル）
const exp = 27; // 経験値
const levelCycle = 5;
const remainder = exp % levelCycle; // 周期の中で何歩目か
console.log(remainder); // 2（5ごとに区切ると2歩目）
console.log(remainder === 0 ? "レベルアップ！" : "あと" + (levelCycle - remainder));
- ポイント: 周期的な処理（5回ごとなど）には「余り」が便利。
つまずきポイント早わかりメモ
- 型の混在: 数値と文字列を混ぜない。入力は
Number("123")で数値化。 - 小数の誤差: 期待値と違うときは
toFixedか「整数にして計算」。 - 割り算の落とし穴: 整数同士でも結果は小数になる。必要なら
Math.floorなどで処理。 - インクリメント前後:
x++は「その場では元の値を返し、あとで+1」。混乱するならx += 1を使う。
練習問題
- 消費税計算（四捨五入）: 税抜980円、税率10%。税込価格を四捨五入して整数にせよ。
- 奇数の合計: 数列
[1,2,3,4,5,6,7]の奇数だけの合計を求めよ。 - 時刻分解: 8,945秒を「時:分:秒」で表示（各2桁）にせよ。
- 小数誤差対策:
0.1 * 3を誤差なく「0.3」にする計算を書け。 - 連結の罠回避:
"100"と50を足して「150」にするコードを書け。
模範解答（確認用）
// 1
const taxInc = Math.round(980 * 1.1);
console.log(taxInc); // 1078
// 2
const arr = [1,2,3,4,5,6,7];
const sumOdds = arr.filter(n => n % 2 !== 0).reduce((a, b) => a + b, 0);
console.log(sumOdds); // 16
// 3
const t = 8945;
const h = Math.floor(t / 3600);
const m = Math.floor((t % 3600) / 60);
const s = t % 60;
const out = `${String(h).padStart(2,"0")}:${String(m).padStart(2,"0")}:${String(s).padStart(2,"0")}`;
console.log(out); // "02:29:05"
// 4
console.log((0.1 * 100 * 3) / 100); // 0.3
// 5
console.log(Number("100") + 50); // 150