JavaScript | 変数に値を代入するときの仕組み

演算子の優先順位と結合規則を、超・初心者向けにわかりやすく

初めてのうちは「どれが先に計算されるの？」って戸惑うもの。ここをつかむと、式が一気に読みやすくなります。例題で手を動かしながら、ゆっくり理解していきましょう。

演算子の優先順位

ざっくりイメージ

• 計算の優先度には「強さ」があります。強いものが先に計算されます。
• 括弧 () は最強。中の計算が必ず先です。

よく使う優先度の順番（強い→弱い）

• 括弧: ()
• べき乗: **
• 掛け算・割り算・余り: *, /, %
• 足し算・引き算: +, -
• 比較: <, >, <=, >=, ==, ===, !=, !==
• 論理: &&（かつ）, ||（または）
• 代入: =, +=, -=, など

例題で確認

let x = 5 + 4 * 3;

let x = 5 + 4 * 3;

• 先に計算: 4 * 3 → 12
• 次に計算: 5 + 12 → 17
  結果は 17

let y = (5 + 4) * 3;

let y = (5 + 4) * 3;

• 先に計算: (5 + 4) → 9
• 次に計算: 9 * 3 → 27
  結果は 27
  → 括弧を使うだけで結果が変わる。

結合規則（同じ強さ同士の並び順）

ルールの核心

• 左から右に計算されるものが多い（例: *, /, +, -）。
• 右から左に計算されるものもある（代表例: ** と = など）。

左から右の例

let a = 12 / 4 * 3;

let a = 12 / 4 * 3;

• 左から: 12 / 4 → 3
• 次: 3 * 3 → 9
  結果は 9

右から左の例（べき乗）

let b = 2 ** 3 ** 2;

let b = 2 ** 3 ** 2;

• 右から: 3 ** 2 → 9
• 次: 2 ** 9 → 512
  結果は 512
  → 2 ** (3 ** 2) と同じ。括弧なしでも右から計算される。

右から左の例（代入）

let c = d = 10;

let c = d = 10;

• 右から: d = 10 が先に実行されて d に 10 が入る
• 次: c = d → c にも 10 が入る

よくあるつまずきポイント

• ラウンドしない割り算: / は整数でも小数でもそのまま割ります。
  例: 5 / 2 → 2.5
• 余り % は“割った余り”:
  例: 10 % 3 → 1
• 比較と論理の組み合わせは括弧で整理:

let result = 5 > 3 && 2 < 1 || true;

let result = 5 > 3 && 2 < 1 || true;

比較が先に評価される → 5 > 3 は true、2 < 1 は false
次に論理演算（&& が || より強い）
　→ true && false → false
　→ false || true → true
　結果は true
　読みやすくするなら (5 > 3 && 2 < 1) || true と書く。

練習しながら身につける例題

計算系

• 掛け算が先

let r1 = 8 + 2 * 3; // いくつ？

let r1 = 8 + 2 * 3; // いくつ？

答え: 14
理由: 2 * 3 → 6、8 + 6 → 14

• 括弧で順序を変える

let r2 = (8 + 2) * 3;

let r2 = (8 + 2) * 3;

答え: 30
理由: (8 + 2) → 10、10 * 3 → 30

• 割り算と掛け算の左から右

let r3 = 20 / 5 * 2;

let r3 = 20 / 5 * 2;

答え: 8
理由: 20 / 5 → 4、4 * 2 → 8

• べき乗の右結合

let r4 = 3 ** 2 ** 2;

let r4 = 3 ** 2 ** 2;

答え: 81
理由: 2 ** 2 → 4、3 ** 4 → 81

真偽値系（比較・論理）

• 比較が先、次に論理

let r5 = 10 > 3 && 4 <= 4 || false;

let r5 = 10 > 3 && 4 <= 4 || false;

答え: true
理由: 10 > 3 → true、4 <= 4 → true
true && true → true、true || false → true

• 括弧で意図を明確に

let r6 = 10 > (3 && 4);

let r6 = 10 > (3 && 4);

答え: false
理由: (3 && 4) → 4（真偽値ではなく「最後の真の値」）
10 > 4 → true
もし「3 と 4 の両方が真か？」を比較したいなら
10 > 3 && 10 > 4 のように書く方が安全。

代入系

• 複合代入の優先度

let n = 5;
n += 3 * 2;

let n = 5;
n += 3 * 2;

答え: n は 11
理由: 3 * 2 → 6、n += 6 → n = n + 6 → 11

• 連続代入は右から左

let a1, a2;
a1 = a2 = 7;

let a1, a2;
a1 = a2 = 7;

答え: a1 も a2 も 7
理由: a2 = 7 → a1 = a2

迷ったらこうする（実務で効くコツ）

• 括弧で意図を固定: 読み手が誤解しないよう、順序を明示する。
• 複雑なら分解: 中間変数を使って段階的に書く。

const base = 5 + 3;      // 読みやすい
const scaled = base * 2; // 間違いにくい
const final = scaled - 1;

const base = 5 + 3;      // 読みやすい
const scaled = base * 2; // 間違いにくい
const final = scaled - 1;

• 論理式はグループ化: && と || が混ざるときは括弧でグループに分ける。
• べき乗と連続代入は右からと思い出す。

小テスト（答えを自分で出してみて）

• Q1: 7 + 3 * 2 - 4 / 2
• Q2: 2 ** 3 ** 1
• Q3: (true || false) && false || !false
• Q4: let x = 1; x = x + 2 * (3 + 1);

解答

Q1: 7 + 3 * 2 - 4 / 2

1. 掛け算・割り算が先
   • 3 * 2 → 6
   • 4 / 2 → 2
2. 残りは 7 + 6 - 2
3. 左から順に
   • 7 + 6 → 13
   • 13 - 2 → 11

✅ 答え: 11

Q2: 2 ** 3 ** 1

• べき乗 ** は 右から左 に計算される

1. 3 ** 1 → 3
2. 2 ** 3 → 8

✅ 答え: 8

Q3: (true || false) && false || !false

1. 括弧の中を先に
   • (true || false) → true
2. 残りは true && false || !false
3. !false → true
4. 優先順位は && が || より強い
   • true && false → false
5. 残りは false || true → true

✅ 答え: true

Q4:

let x = 1;
x = x + 2 * (3 + 1);

1. 括弧 (3 + 1) → 4
2. 2 * 4 → 8
3. x + 8 → 1 + 8 → 9
4. x = 9

✅ 答え: 9