今回はJavaScriptの「変数」について、勉強したことをまとめていきます。
JavaScriptの勉強を始めたとき、最初は変数という言葉の意味がよく分かりませんでした。
変数宣言、代入、再代入など、初めて聞く用語も多く、なかなか頭に入ってこなかったです。
ですが、実際にコードを書いたり、簡単なアプリを作ったりする中で、少しずつ理解が深まってきました。
今回は、そんな変数について整理していきます!
① 変数とは?
変数とは、データを入れておく箱のようなものです。
例えば、「animal」という箱に「ねこ」という文字列を入れたり、「weight」という箱に数値の「5」を入れたりすることができます。
let animal = 'ねこ';
let weight = 5;
このように、変数を使うことでデータに名前をつけて、あとから利用できるようになります。
変数は、複雑なデータ処理を行うときにも必要になる大切な仕組みです。
② 変数の特徴
変数には、次のような特徴があります。
- 変数にデータを入れることができる
- すでに入っているデータを別の値に変更できる場合がある
- 最初に値を指定せず、変数だけを宣言することもできる
例えば、次のように書くことができます。
let animal = 'ねこ';
animal = 'いぬ';
最初は「ねこ」が入っていた変数に、「いぬ」を再び代入しています。
このように、変数に新しい値を入れることができます。
一方、最初に値を指定せずに宣言することもできます。
let animal;
この場合、変数 animal の値は undefined になります。
③ 変数宣言とは?
変数を用意して、使えるようにすることを「変数宣言」といいます。
変数について勉強するときに、まず覚えておきたい言葉です。
また、変数に付ける名前を「変数名」、変数に入れるデータを「値(あたい)」と呼びます。
例えば、次のコードを見てみます。
let animal = 'ねこ';
let:変数を宣言するためのキーワードanimal:変数名=:代入演算子'ねこ':値
このように、それぞれに役割があります。
④ letを使った変数の書き方
let を使うと、再代入できる変数を宣言できます。
let animal = 'ねこ';
let weight = 5;
animal という箱に文字列の「ねこ」を入れ、weight という箱に数値の「5」を入れています。
文字列を扱うときは、基本的にシングルクォーテーションかダブルクォーテーションで囲みます。
一方、数値はクォーテーションで囲まずに記述します。
⑤ 変数を使うには?
宣言した変数は、コードの中で利用できます。
例えば、次のコードです。
let animal = 'ねこ';
console.log(animal);
実行すると、コンソールに次のように表示されます。
ねこ
console.log() は、値などをコンソールに出力するためのものです。
変数名を指定することで、変数に入っている値を利用できることが分かります。
⑥ 代入とは?
変数に値を入れることを「代入」といいます。
代入には = という記号を使います。この記号は「代入演算子」と呼ばれています。
例えば、次のコードです。
let animal = 'ねこ';
これは、右側にある 'ねこ' という値を、左側の animal という変数に代入するという意味です。
最初は、算数で習った「=」と同じ感覚で考えてしまい、少し混乱しました。
でも、JavaScriptでは右側の値を左側の変数に入れる、と日本語で読み下してみると理解しやすくなりました。
⑦ 再代入とは?
すでに値が入っている変数に、別の値をもう一度代入することを「再代入」といいます。
let animal = 'ねこ';
animal = 'いぬ';
console.log(animal);
実行結果は次のようになります。
いぬ
最初に代入した「ねこ」ではなく、あとから代入した「いぬ」が表示されます。
let で宣言した変数は、このように再代入することができます。
一方、JavaScriptには const というキーワードもあります。
⑧ constを使った変数の書き方
const も変数を宣言するためのキーワードですが、let とは違い、再代入することができません。
const animal = 'ねこ';
このように、const では宣言するときに初期値を指定します。
そのあと、別の値を再代入しようとするとエラーになります。
では、何でも再代入できる let のほうが便利なのでしょうか?
最初は私もそう思いました。
しかし、コードが長くなってくると、変数が途中で変更されているかどうかを確認するのが大変になります。
再代入する必要のない変数を const で宣言しておけば、途中で別の値が代入されていないことが分かります。
そのため、JavaScriptでは、再代入する必要がなければ const を優先し、再代入が必要な場合に let を使うという考え方が一般的です。
まとめ
ここまで、JavaScriptの変数についてまとめてきました。
最初は本当に意味が分からず、変数宣言や代入などの用語を覚えるのにも苦労しました。
今は基礎の学習を終えて、簡単なアプリを作りながら実践していますが、ようやく変数について少し理解が深まったところです。
実際にコードを書いてみると、用語の意味を覚えるだけではなく、どのような場面で使うのかを考えることも大切だと感じました。
最初はたくさんの用語が飲み込みづらくても、繰り返し使っていくうちに、少しずつ理解できるようになると信じています!
次回は「データ型」について、勉強したことをまとめていきます。
だんだん難しくなってきますが、引き続き頑張っていきます!

