JavaScriptの変数を勉強する!宣言や代入の方法。 【var・let・const】

JavaScriptの変数を勉強する!宣言や代入の方法。 【var・let・const】

この記事では、JavaScriptの変数の種類やその使い方について説明していく。

変数はプログラミングを書く上でもっとも重要な存在だ。バグの発生を防ぐためにもしっかりと仕様を理解しておこう。

変数とは?

「変数」とは、数値や文字列を収納した箱のような物だと考えてほしい。

JavaScriptの変数にはvar・const・letという3種類がある。

ES5以前のバージョンでは、varのみだったが、ES6からはconstとletが加わり3種類となった。

それぞれに以下のように使い分けられる。

  • var
    JavaScriprに以前からある変数。現在はconst・letのいずれかを使うことが推奨されている。
  • const
    値を書き換えしない場合に使われる変数。
  • let
    値の再代入を必要とする場合に使われる変数。書き換えを必要としない場合はconstを使用することが推奨されている。

変数の使い方

では、変数の使い方を確認していこう。

変数の宣言

まずは変数を使用することをプログラムに明記する。このステップをプログラミングの世界では「変数の宣言」と呼ぶ。変数を宣言すると変数の内容を記録するためのスペースがメモリ上に確保される。

let型でmyTextという名前の変数を宣言する場合は以下のように記述する。

let myText;

使用する変数のタイプが同じであれば複数の変数をまとめて宣言することもできる。

let myText, yourText;
注意!
JavaScriptは実行の際にプログラム側で変数のデータ型を決定する「動的な型指定の言語」。変数を宣言する際にはデータ型の指定はおこなわない。

変数の代入

宣言した変数に値(数値や文字列など)を格納することを「代入」と呼ぶ。

値を代入する際には「=」を使用する。

let myText; 
myText = 'サンプルテキスト';

これで変数に「サンプルテキスト」という文字列が代入された。

let myText; 
myText = 'サンプルテキスト';

letのタイプを持つ変数はプログラム内で何度も内容を書き換えることができる

let myText; 
myText = 'サンプルテキスト';
myText = '違うテキスト';

変数の初期化

変数を宣言すると同時に値を代入することもできる。

これを「変数を初期化する」と呼ぶ。

let myText = 'サンプルテキスト';

変数の命名ルール

ここで変数の命名規則についても触れておきたい。

JavaScriptの変数の名前には「キャメルケース記法」という技術が使われる。

キャメルケース記法では、文字の先頭は小文字、それ以降の単語の頭文字は大文字で記される。

(例)getCustomerById、convertDataType

その他にも以下のような事を心がけるといい。

  • 中身がまったくわからない名前は避ける。
    → (悪い例)var1、 value
  • 変数名は長すぎず、短すぎずが望ましい。
    → (悪い例)c、 oldCustomerNameWhichWillBeWrittenByNewUserName
  • 変数名には英単語を使うのが望ましい。
    → (悪い例)kokyaku

変数の値を確認する

変数に格納されている値はconsole.log()という命令文を使用して中身を確認することができる。

let myText = 'サンプルテキスト';
console.log(myText);

ブラウザを使用してコードを実行した場合は、console.logで出力した文字列・数値はこのように確認することができる。

コンゾール出力の例(Google Chorme)