【JavaScript入門】const：定数変数

このページで解説している内容は、以下の YouTube 動画の解説で見ることができます。

const：定数変数

　JavaScript には、「値を後から変更できる変数」を宣言する let と、「値を変更できない定数」を宣言する const の2つがあります。プログラムを書く上で、変更が必要ない値を誤って書き換えてしまうと重大なバグを引き起こす可能性があります。そこで、値が変わらないことが明白であれば、const を使って定数として宣言するのが安全策です。ここでは、定数変数である const の使い方とそのメリットを見ていきましょう。

１．定数変数 `const` とは

　const は JavaScript で定数変数を宣言するためのキーワードです。定数という名前のとおり、一度値を代入すると、その値を後から変更できなくなります。

1.1. 変数と定数の違い

種類	宣言キーワード	特徴
変数	`let`	後から何度でも値を再代入できる。
定数	`const`	宣言時に値を代入し、以降は再代入できない。

２．定数の宣言方法

const で宣言するときは、同時に値を代入する必要があります。もし値を指定しないとエラーになります。

2.1. 基本構文

const 定数名 = 値;

宣言と同時に値をセットしないといけません。
一度セットしたら再代入は不可能です。

2.2. サンプルコード

　下のように、「1日の時間は変化しない値なので const にしておく」など、明らかに変わる予定がないデータに最適です。

const HOURS_IN_DAY = 24;
console.log(HOURS_IN_DAY); // 24

// 再代入しようとするとエラー
// HOURS_IN_DAY = 25;  ← これはエラー

３．定数を使うメリット

バグを防止：書き換える必要がない値を const にしておくと、うっかり再代入してしまうリスクを回避できる。
意図が明確：コードを読む側に「この値は変わらない」という情報を伝え、可読性を高める。
基本的には const 推奨：後から値を変える必然性があるときのみ let を使う、と決めるとコードが安定しやすい。

４．HTMLとJavaScriptのサンプル

　ファイル名を「constVariableSample.html」とします。ブラウザの開発者ツール（コンソール）を開いて、実行結果を確認してください。

【constVariableSample.html】

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>constVariableSample.html</title>
</head>
<body>
  <h1>const で定数変数を宣言するサンプル</h1>
  <p>コンソールを開いて結果を確認してください。</p>

  <script>
    // 1. 定数の宣言例
    const APP_NAME = 'MyCoolApp'; // このアプリの名称は不変
    console.log('アプリ名:', APP_NAME);

    // 2. 後から値を変更しようとするとエラー
    // APP_NAME = 'AnotherApp'; // ← エラーになる

    // 3. let との使い分け
    let version = 1;           // バージョンは今後変わる可能性があるので let
    console.log('バージョン:', version);

    version = 2;               // 新バージョンに更新
    console.log('更新後のバージョン:', version);

    // 定数をうまく使うことでバグを防ぎ、意図を明確にできる
    const HOURS_IN_DAY = 24;
    console.log('1日の時間は:', HOURS_IN_DAY, '時間です');
  </script>
</body>
</html>

実行結果

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

アプリ名: MyCoolApp
バージョン: 1
更新後のバージョン: 2
1日の時間は: 24 時間です

　このサンプルでは、const APP_NAME のように変更が必要ない値は定数にし、let version のように後から変更しうる値は変数にしています。APP_NAME に再代入しようとすると、コンソール上でエラーが出るので試してみてください。

まとめ

const を使った定数変数は、宣言時に値を代入し、以降は値を変更できません。
不変のデータを定数にすることで、誤って再代入するバグを防ぎ、コードの意図を明確にできます。
JavaScript では、再代入する必要がない値は原則 const、再代入の可能性がある場合にのみ let を使用する運用が推奨されます。

定数をうまく活用し、プログラムの安定性と可読性を高めましょう。

【JavaScript入門】const：定数変数