JavaScriptの練習をしてみた【基本文法:変数宣言編】

JavaScript

この記事では,JavaScriptの基礎文法として,変数の宣言を学習します.

変数の宣言

JavaScriptでは,変数を宣言する必要があります.

変数を宣言するときには,constかletかvarを付けて宣言します.

const

counstで変数を宣言するには,以下のようになります.例は文字列ですが,数値などを入れることもできます(『データ型』を参照).

const const_value = "This couldn't be change";

constで宣言した変数の値は変えることができません.宣言した変数に他の値を入れようとすると,エラーがでます.

const const_value = "This couldn't be change";
const_value = "was changed";

2行目で,以下のエラーが出ます.

TypeError: Assignment to constant variable.

constは値を書き換えられないので一見不便ですが,逆に言えばソースコードの保守性を守るということができので開発ではよく使われます.

値が変わらないはずである変数を用いるときには,constを用いると良いでしょう.

ただし,constで宣言したオブジェクトの中身などは後で変えられるため,厳密に定数ではなく,あくまで変数です.

let

letで変数を宣言するには,以下のようにします.

let let_value = "This is let value";

また,letや次に紹介するvarでは,空(値が入っていない状態)で宣言して,後から値を入れることもできます.

let let_value;
let_value = "This is let value";

letで変数を宣言すると,値を書き換えることができます.

let let_value = "This is let value";
let_value = "was changed";

console.log(let_value);

※console.log(値)は値をコンソールに出力するコマンドです.

出力結果

was changed

var

varで宣言した変数も,letと同じように値を書き換えることができます(varもlet同様,宣言時に値を入れないことも可能).

var var_value = "This is var value";
var_value = "was changed";

console.log(var_value);

出力結果

was changed

varとletの違い

varはletとかなり似ていますが,厳密には違います.何が違うのかというと,以下が違います.

・varでは同じ名前の変数を再宣言できてしまう

・スコープ(変数の有効範囲)の範囲がvarの方が広い

varでは同じ名前の変数を再宣言できてしまう

varでは,同じ名前で変数を再宣言できます.

var var_value = "first";
var var_value = "second";

console.log(var_value);

出力結果

second

var var_value = “second”;でエラーが出ないため,最初に宣言したvar_valueが上書きされてしまいます.

“second”を値に持つ変数を別の名前で宣言しようとしたのに誤って同じ名前で宣言してもエラーが出ませんから,varを使うと間違ったソースコードを書く危険性が高まります.

一方,letやconstでは同じ名前で宣言するとエラーが出てくれます.

スコープ(変数の有効範囲)の範囲がvarの方が広い

varとletを比べると,スコープがvarの方が広いです.

スコープとは,宣言した変数の有効範囲のことです.

varのスコープは関数です.

if (true) {
  var value_var = "Hello";
}

console.log(value_var);

出力結果

Hello

この場合,関数はこのソースコード全体を指すので,エラーは発生せず,「bar」と出力されます.

(関数とは何か,については別の記事で紹介します)

一方,letのスコープはブロックです.

if (true) {
  let value_let = "Hello";
}

console.log(value_let);

出力結果

ReferenceError: value_let is not defined

ブロックとは,{ … }のことです.つまり,{ … }の中でletで宣言された変数は,このブロックの中でのみ有効です.

したがって,上の例では,console.log(value_let);の時点ではvalue_letは有効になっておらず,エラーが出力されます.

ちなみに,constのスコープもブロックです.

まとめ

・変数を宣言するときには,constかletかvarを付けて宣言する.

・constで宣言した変数の値は変えることができない.letかvarで宣言した変数の値は書き換えることができる.

・varでは同じ名前の変数を再宣言できてしまう

・varのスコープは関数,let, constのスコープはブロック

次回は,基本文法としてデータ型について学習します.

コメント

タイトルとURLをコピーしました