【JavaScript入門】演算子

　JavaScript では、値同士を計算して新しい値を生み出す「演算子」が数多く登場します。足し算 (+)、引き算 (-)、掛け算 (*)、比較演算子（=== など）、論理演算子（&& など）はすでに幾度となく触れてきましたが、そのほかにも代入の仕方を簡略化する代入演算子など、よく登場するものがいくつか存在します。ここでは、とくに便利な代入演算子を取り上げ、その使い方を紹介します。

１．代入演算子

　=（イコール）で変数に値を入れる構文はすでにおなじみですが、同時に演算も行いたい場合には、以下のような代入演算子を使うとコードを短くできます。

演算子処理の内容例
+=変数の値に右辺の値を加算x += 5; → x = x + 5;
-=変数の値から右辺の値を減算y -= 3; → y = y - 3;
*=変数の値に右辺の値を掛け算z *= 2; → z = z * 2;
/=変数の値を右辺の値で割り算a /= 10; → a = a / 10;
%=変数の値を右辺の値で割った余りb %= 4; → b = b % 4;
**=変数の値を右辺の回数だけべき乗c **= 3; → c = c ** 3;

このように、同じ変数に対して演算と再代入を同時に行いたい場合、シンプルな記述で完結できます。

２．サンプルコード (HTML + JavaScript)

　次の例を「myOperatorExample.html」というファイル名で保存し、ブラウザで開いて、コンソールの出力を確認してください。

【myOperatorExample.html】

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>myOperatorExample.html</title>
</head>
<body>
  <h1>演算子サンプル</h1>
  <p>開発者ツールのコンソールを開いて結果を確認してください。</p>

  <script>
    // 1. += を使った例
    let num = 10;
    console.log('初期値 num:', num);
    
    num += 5; // num = num + 5;
    console.log('num += 5:', num);

    // 2. *= や /= の例
    let value = 20;
    console.log('初期値 value:', value);

    value *= 2; // value = value * 2;
    console.log('value *= 2:', value);

    value /= 5; // value = value / 5;
    console.log('value /= 5:', value);

    // 3. 文字列に += を使った結合の例
    let message = '今日のメニューは';
    message += 'カレー';
    console.log('文字列結合 message:', message);

    // 4. べき乗 (**=) の例
    let exponent = 3;
    exponent **= 2; // exponent = exponent ** 2;
    console.log('exponent **= 2:', exponent);
  </script>
</body>
</html>

実行結果

デバッグコンソールの出力

初期値 num: 10
num += 5: 15
初期値 value: 20
value *= 2: 40
value /= 5: 8
文字列結合 message: 今日のメニューはカレー
exponent **= 2: 9

まとめ

  • 代入演算子は、演算と再代入をひとまとめに書ける省略記法であり、コードの可読性を向上させる。
  • += は数値の加算だけでなく文字列の結合にも利用できる。
  • 他にも減算 -=、乗算 *=、除算 /=、剰余 %=、累乗 **= などがある。

　こうした演算子を活用すると、プログラムをシンプルに書けるので、必要に応じて習慣的に使うようにするとよいでしょう。