JavaScript講座第4回目です!今回は「変数」について学びます。ここから少しずつ難しくなりますが、焦らず丁寧に進めていきましょう。

変数とは?
変数とは、数値や文字を格納する「入れ物」のようなものです。最初はイメージしづらいかもしれませんが、コードを書いていくうちに必ず理解できます。今はざっくりと「データを保存するためのもの」と捉えておけばOKです。
JavaScriptでの変数の扱い方
JavaScriptではletキーワードを使用して変数を宣言します。
let name;
このコードではnameという変数を宣言しましたが、まだ値は入っていません。変数を宣言したら、値を代入(初期化)する必要があります。
変数の初期化
//変数を用意
let name;
//変数に値を入れる(初期化)
name = "Taro";
この例では、nameという変数に”Taro”という文字列を代入しました。
また、変数の宣言と初期化を同時に行うこともできます。
let name = "Taro";
let age = "25";
変数の出力
let name = "Taro";
console.log(name);
このコードを実行するとコンソールにTaroと出力されます。
変数のスコープ
JavaScriptには変数のスコープ(有効範囲)があります。letを使用した変数はブロックスコープを持ちます。
{
let message = "Hello";
console.log(message); // 出力: Hello
}
console.log(message); // エラー: message is not defined
スコープを理解することで、より安全に変数を管理できます。
定数とは?
プログラムによっては、値を変更したくない変数もあります。そのような場合に使用するのがconstキーワードです。
const color = "red";
console.log(color); // 出力: red
color = "blue"; // エラーが発生する
constで宣言した変数は値の再代入ができません。
letとconstの使い分け
キーワード | 用途 | 再代入 |
let | 変数 | 可能 |
const | 定数 | 不可 |
基本的に、値を変更しない場合はconstを使い、必要に応じてletを使うのがベストプラクティスです。
varとの違い
昔のJavaScriptではvarが使われていましたが、現在はletとconstを使うことが推奨されています。
var x = 10;
if (true) {
var x = 20;
}
console.log(x); // 出力: 20
varは関数スコープを持ち、ブロックを超えて影響を与える可能性があるため、意図しないバグの原因になりやすいです。
変数の命名規則
変数名には以下のルールがあります。
- 変数名は文字・アンダースコア(_)・ドルマーク($)のいずれかで始めなければならない。
- スペースは使用不可。
- 変数名には文字、数字、アンダースコア、ドルマーク以外を含めることはできない。
- 大文字と小文字を区別する。(Ageとageは別の変数)
- 予約語は使用不可(例えばlet、const、varなどのJavaScriptのキーワードは使えない)。
また、変数名は意味が分かりやすいものにすることが推奨されます。
練習問題
(1) 変数を宣言する際に使用するキーワードは?
(2) 定数を宣言する際に使用するキーワードは?
(3) 値の再代入ができないのは let か const のどちら?
(4) 高さ5、幅10の長方形の面積を求め、面積を出力せよ。ただし、高さ、幅、面積を変数として使用すること。
(5) varを使用するとどのような問題が発生する可能性があるか説明せよ。
(6) 変数のスコープとは何か、説明せよ。
練習問題の解答
// (1) let
// (2) const
// (3) const
// (4) 長方形の面積を求める
let height = 5;
let width = 10;
let area = height * width;
console.log(area); // 出力: 50
// (5) varは関数スコープを持つため、意図せず変数が上書きされる可能性がある
// (6) 変数のスコープとは、その変数が有効となる範囲のこと。
コメント