【初心者向け】JavaScriptの変数宣言と使い方をわかりやすく解説

変数って何？

変数とは、値をしまっておく箱のようなものです。たとえば、次のようなコードがあります。

let flower = "さくら";

このコードは、「flower という名前の箱に、さくら という文字を入れたよ！」という意味になります。
つまり、あとから flower を使えば、毎回 “さくら” と書かなくてもよくなります。

なんで変数が必要なの？

変数を使う理由は、主に以下の3つです。

①同じ値を何度も使える！

let greeting = "こんにちは！";
console.log(greeting); // こんにちは！
console.log(greeting); // こんにちは！

一度代入すれば、何回でも使いまわせます。これによりコードの修正がラクになり、ミスも減らせます。

② あとで中身を変えられる！

let score = 50;
score = 70; // ← 点数を上書き
console.log(score); // 70

たとえば、テストの点数が変わったときでも、変数の中身を変更するだけで済みます。

③ 計算結果を保存できる！

let price = 500;
let tax = price * 0.1;
let total = price + tax;

console.log("税込価格: " + total); // 税込価格: 550

計算式を分けて変数にしておくことで、読みやすくてメンテナンスしやすいコードになります。

JavaScriptの変数宣言には3種類ある【var / let / const】

JavaScriptでは、変数を宣言する方法が3種類あります。

宣言方法	再代入	再宣言	主な用途
let	〇	✖	一般的な変数
const	✖	✖	再代入しない値（定数）
var	〇	〇	古い書き方（非推奨）

それぞれの使い方や違いを詳しく見ていきましょう。

let：一番よく使うふつうの変数

letは、現在の JavaScript で最も一般的に使われている変数の宣言方法です。
一度宣言した変数には再代入が可能ですが、再宣言はできないという特徴があります。
この性質により、同じ変数名をうっかり二重に定義してしまうようなバグを防ぎやすくなるため、推奨されています。

▼特徴

再代入できるけど、再宣言はできない

▼再代入はOK！

let age = 25;
age = 26;
console.log(age); // 26

▼再宣言はNG！

let age = 30;
let age = 25; // ← エラーになります

const：絶対に変えたくない値に使う定数

constは、「固定しておきたい値」（たとえば消費税など）を扱うときに使う変数の宣言方法です。
最大の特徴は、一度代入した値は変更できないこと。つまり、「定数（変えられない変数）」として使われます。
この特性により、意図しない値の変更を防ぐことができるため、バグの予防にも効果的です。
「この値はずっと変わらないよ！」というときはconstを使うようにしましょう。

▼特徴

• 一度代入したら変更できない
• ルールが厳しい分、安全性が高い

▼再代入はNG！

const pi = 3.14;
pi = 3.14159;  // ← エラーになります
console.log(pi); // 3.14

▼再宣言はNG！

const age = 30;
const age = 25; // ← エラーになります

var：古い書き方（初心者は避けましょう）

varは、JavaScriptが誕生した初期から使われてきた変数の宣言方法です。
しかし、昔の仕組みゆえの注意点や予期しない動き（バグのもとになる動き）がいくつかあります。
これらの問題点を解消するために、letやconstが後から新しく作られました。
現在では、ほとんどの場面でvarを使う必要はありませんし、新しいコードではletかconstを使うのが基本です。
ただし、過去の古いコードやライブラリではvarが使われていることもあるので、見かけたときに慌てないように、どんな特徴があるのかは知っておくと安心です。

▼特徴

• 再宣言・再代入が両方できる → バグの原因になりやすい
• 新しいコードではあまり使われない

▼再宣言できてしまう例

var user = "太郎";
var user = "花子"; // エラーにならない
console.log(user); // 花子

このように、意図しない上書きが発生する可能性があります。基本的にはletかconstを使いましょう。

よくあるエラーとその対処法

①同じ名前で再宣言してしまった！そんな時は、、、

let score = 90;
let score = 100; // エラー！再宣言はNG

対処法： 変数名を変える、または再宣言せずに再代入だけにする。

②const 変数に再代入しようとした！そんな時は、、、

const name = "さくら";
name = "たけし"; // エラー！

対処法： 値を変更する可能性があるなら let を使いましょう。

まとめ

JavaScriptでは、変数の宣言に var・let・const の3種類があります。それぞれの特徴を理解して、安全で読みやすいコードを書くことが大切です。

• 基本は let と const を使い分けよう
• var は使わないようにしよう
• 値を変えたい場合は let、変えたくない場合は const