【JavaScript】変数 - 値の記憶と取得

【JavaScript】変数 - 値の記憶と取得

JavaScriptの変数をご紹介します。

変数

変数は値を記憶する領域です。
変数に記憶した値は取得することができます。

変数の宣言

変数を使うには変数の宣言(定義)が必要です。

宣言キーワード 変数名;

変数名は自由に決めることができますが、次の3つのルールがあります。

  • アルファベット(大文字/小文字)、アンダーバー(_)、数字のみ
  • 頭文字に数字は使えない。
  • 予約語(JavaScriptの記法等で使用する単語)は使えない。

宣言キーワードはlet、var、constの3種類があります。

let

let 変数名;

letの後に変数名を記述します。

このキーワードで宣言する変数は記憶する値を変更できます。

また、他の変数名と重複できません。

var

var 変数名;

varの後に変数名を記述します。

このキーワードで宣言する変数は記憶する値を変更できます。

また、他のvarキーワードで宣言した変数の変数名と重複してもエラーにはなりません。
ただし、変数名の重複は意図しない動作が発生する可能性があるため非推奨です。

cont

const 変数名 = 初期値;

contの後に変数名を記述します。

このキーワードでは変数の宣言と同時に初期値を代入します。
※ 値の代入は後述で解説します。

値の変更はできず、一定の値を保持するため定数とも呼ばれます。

また、他の変数名と重複できません。

使い方

宣言した変数はプログラムで使うことができます。

値の代入

変数に値を記憶することをプログラミング用語で代入と良います。

基本構文

変数 = 値;

イコール(=)は代入演算子と呼ばれます。
代入演算子は変数に値を代入する役割を持ちます。

数学や算数で使われる意味とは異なり、左右が等しいことを表すものではありませんので注意してください。

また、変数の宣言と同時に値を代入することを変数の初期化と呼びます。

宣言キーワード 変数 = 値;

サンプル

let message = "Hello World";

変数messageを宣言し、"Hello World"を代入し初期化しています。
コンソールに何も表示されていませんが、console.logなどで出力していないので正常な動作です。

値の取得

値の取得は変数に記憶した値を取り出すことです。

基本構文

変数

値を取得したい処理の部分に変数名を記述します。

サンプル

let message = "Hello World";
console.log(message);
Hello World

変数messageを宣言し、"Hello World"を代入し初期化しています。
2行目で変数の値を取り出して、コンソールに出力する処理を行ないます。

変数の初期化

letキーワードとvarキーワードで宣言する変数は初期化しなくても使うことができます。
しかし、初期化しないと値が不明な状態となるためバグやエラーの原因となります。
意図しない動作を避けるためにJavaScriptに限らずプログラミング言語では変数の初期化を行うことが推奨されています。

ケース

変数のいくつかのケースをご紹介します。

値の再代入

変数の値は代入によって変更することができます。
次のコードは1行目と3行目で値を代入したため、2行目と4行目の出力では異なる出力結果となります。

let message = "Hello World";
console.log(message);
message = "Good Morning"
console.log(message);
Hello World
Good Morning

変数名の重複

次のコードはletキーワードで宣言した変数の変数名が既に存在ためエラーになります。

var x = "sample";
let x = "sample";
Uncaught SyntaxError: Identifier 'x' has already been declared;

これはconstキーワードでも同様です。