const, let, var とは？
JavaScript の定数・変数を宣言するときのキーワードです。
構文は次のようになります。
const 定数名 = 値; let 変数名 [= 値]; var 変数名 [= 値];
具体的には次のように使います。
const name = 'Taro'; let total = 10; var year = 2020;
const, let, var の違いとは？
const
const は、定数（読み取り専用）で、再代入することができません。
次のようなコードの場合、エラーになります。
const name = 'Taro'; name = 'Hanako'; // 再代入しようとしてエラーが発生する ： Uncaught TypeError: Assignment to constant variable.
また、const は変数宣言のときに初期値を代入する必要があるため、下記のような書き方の場合もエラーになります。
const name; // 初期値を代入していないためエラーが発生する ： Uncaught SyntaxError: Missing initializer in const declaration
let
let は const と異なり、値を再代入できる変数になります。
次のように再代入することが可能です。
let total = 10; total = 11;
また、let は変数宣言のときに初期値を代入しなくても、const と異なりエラーになりません。
変数宣言のときに初期値を代入しなかった場合の値は undefined になります。
let total; console.log(total); // undefined がコンソールに出力される
var
var は let と似ていて、変数宣言のキーワードとして使用できます。
ただ、var にはいくつか問題点があり、その問題点を解消するために const, let が作られたという背景もあります。
そのため、今後は var を使う場面は少なくなっていくと思います。
var の問題点としては、主に次の 2点です。
問題点① 同じ変数名で宣言が可能
同じ変数名で宣言ができてしまうと、変数を二重で定義してしまう恐れがあり、不具合の原因になりかねません。
// var ではエラーにならない var a = 1; var a = 2; // let ではエラーになる let b = 1; let b = 2; // すでに宣言しているのでエラーが発生する ： Identifier 'b' has already been declared
問題点② 変数の巻き上げが起こる
変数の巻き上げの例の 1つとして以下のような挙動があります。
// var の挙動 console.log(c); // undefined ( ReferenceError ではない) がコンソールに出力される var c = 3; console.log(x); // 3 がコンソールに出力される // let ではエラーになる console.log(d); // 変数を宣言する前にコンソール出力をしようとしてエラーが発生する ： Cannot access 'year' before initialization let d = 4;
上記のようになるのは、var を使用して宣言された変数は、コードが実行されるよりも前に生成されるという理由です。
そのような理由から、 var は意図しない挙動で不具合を発生させてしまう恐れがあります。
参考サイト
MDN web docs / const
MDN web docs / let
MDN web docs / var
JavaScript Primer / 変数と宣言
最近のコメント