JavaScriptの変数入門【let・const・varの違い】

JavaScript 変数とは？let・const・varの違い

プログラミングで「値を記憶しておく箱」のことを 変数（へんすう） といいます。JavaScript 変数には let・const・var の3種類の宣言方法があります。

この記事では、それぞれの違いと正しい使い分けを初心者向けにわかりやすく解説します。

let：値を変えられる変数

let は後から値を変えられる変数です。カウンターや状態の管理など、値が変わる場合に使います。

let count = 0;
console.log(count); // 0

count = count + 1;  // 値を変えられる
console.log(count); // 1

let name = '田中';
name = '鈴木'; // 再代入OK

💡 DOM操作入門で基礎を確認できます。

const：値を変えられない変数

const は一度設定したら値を変えられない変数です。定数（ていすう）とも呼ばれます。変わらない値には const を使うのが推奨されています。

const PI = 3.14159;
const siteName = 'プログラミング入門';

// PI = 3; // エラー！constは再代入できない

var：古い書き方（使わない）

var は古いJavaScriptの変数宣言方法です。スコープ（変数が使える範囲）の扱いが複雑で、バグの原因になりやすいため、現在は let と const を使うのが一般的です。

// varは使わない（古い書き方）
var x = 10;

// letとconstを使う（現代の書き方）
let y = 10;
const z = 20;

🔗 あわせて配列入門もチェックしてみましょう。

変数に入れられるデータの種類

const name   = '田中';      // 文字列（string）
const age    = 15;          // 数値（number）
const isPass = true;        // 真偽値（boolean）：true / false
const fruits = ['りんご', 'バナナ']; // 配列（array）
const user   = { name: '田中', age: 15 }; // オブジェクト

📖 詳しくはスコープとはで解説しています。

let・const・varの使い分け

JavaScriptで変数を宣言するキーワードは3つあります。それぞれの違いを理解しましょう。

letは「あとから値を変更できる変数」を宣言します。カウンターやスコアなど、値が変わるものに使います。

constは「一度入れたら値を変更できない変数」を宣言します。定数（じょうすう）とも呼ばれます。変わらない値（サイト名、消費税率など）に使います。間違えて値を変えようとするとエラーが出るので、バグを防げます。

varは古い書き方です。letやconstが登場する前に使われていました。今は使う必要がありません。古いコードで見かけることがありますが、新しく書くときはletかconstを使いましょう。

迷ったらまずconstを使いましょう。あとから値を変える必要が出てきたら、letに変えればOKです。

変数の命名ルール

変数名には守るべきルールがあります。

• 英数字とアンダースコア（_）が使える
• 数字から始めることはできない（「1name」はNG）
• 予約語（if、for、functionなど）は使えない
• 大文字と小文字は区別される（nameとNameは別の変数）

良い変数名のコツも紹介します。

• 何が入っているかわかる名前をつける（xよりもscoreのほうがわかりやすい）
• 2語以上のときはキャメルケースを使う（userName、totalPriceのように、2語目以降の先頭を大文字にする）
• 短すぎず長すぎない名前にする

変数でよくあるミス

ミス1：宣言せずに使う

letやconstを書かずにいきなり変数名を使うと、意図しない動作になることがあります。必ず宣言してから使いましょう。

ミス2：constで宣言した変数に再代入する

constで宣言した変数に新しい値を入れようとすると、エラーになります。値を変えたい場合はletで宣言し直しましょう。

ミス3：スペルミスで別の変数になる

「score」と「scroe」は別の変数です。スペルを間違えると、undefinedが返ってきます。変数名は正確に書きましょう。コピー＆ペーストを活用すると、スペルミスを防げます。

ミス4：スコープを理解していない

if文やfor文の中でletで宣言した変数は、そのブロックの外からはアクセスできません。これを「ブロックスコープ」と呼びます。変数が見つからないエラーが出たら、宣言した場所を確認しましょう。

変数はプログラミングの最も基本的な概念です。ここをしっかり理解しておけば、この先の学習がスムーズに進みます。

まとめ

JavaScriptの基礎はJavaScript入門で復習できます。

あわせて読みたい記事

• JavaScriptとは？初心者向け解説 — JS基礎に戻る
• JavaScript文字列操作入門 — 文字列型の変数
• JavaScript配列入門 — 配列型の変数
• JavaScriptオブジェクト入門 — オブジェクト型の変数
• JavaScript関数入門 — 関数内の変数スコープ
• JavaScript if文入門 — 条件分岐で処理を分ける