JavaScriptのlet、constの変数宣言まとめ！varの違いも！

けど、そんな中で悩むことは、

ですよね。

今回はそんなお悩みを解決する

についてまとめます！

JavaScriptで変数を宣言する方法

JavaScriptで変数を宣言する方法について説明をします。

varについて

varは関数スコープまたはグローバルスコープの変数宣言をおこないます。同時に値を初期化することができます。

let、constについて

JavaScriptの標準規格であるECMAScript2015で追加された宣言形式となります。

これまで使用されてきたvarはグローバルスコープの変数宣言でしたが、let、constはブロックスコープでの変数宣言ができることが特徴になります。

ブロックスコープとは処理の｛｝でくくる部分で、例えばIF文でしたらif(){＜ブロックスコープはここ＞}となります。

let、constとvarの違いは？

let、constとvarの違いはlet、constは｛｝内限定で利用できることに対して、varはどこでも有効であるということです。

例えばvarの場合のサンプルコードを実行してみましょう。

var value=1;
console.log(value);

if(true){
  var value=2;
}
console.log(value);

結果です。

次はletにしてみましょう。

let value=1;
console.log(value);

if(true){
  let value=2;
}
console.log(value);

結果です。

タカヒロ

ブロックスコープ内のみ有効な変数であることがわかりますね。
For文などで使えば他での干渉が防げるメリットがあるというわけです。

let、constは再宣言できない

let、constは再宣言できないことに対して、varは再宣言可能という違いもあります。

varは以下のように再宣言してもエラーとはなりませんが、

var value=1;
console.log(value);
var value=2;
console.log(value);

let、constは再宣言するとエラーとなります。

let value=1;
console.log(value);
let value=2;
console.log(value);

結果です。

基本的にconstは変数の再代入は不可

基本的にconstは変数の再代入は不可となっています。

constは定数と呼ばれ、変数の再代入は行われない前提となります。

タカヒロ

例えば消費税の税率など変更させたくない変数をconstで宣言していきます。

const value=1;
console.log(value);
value=2;
console.log(value);

結果です。

ただ、ブロックスコープの仕様がありますので、｛｝でくくればダブル宣言が可能です。

const value=1;
console.log(value);
if(true){
	const value=2;
  console.log(value);
}

結果です。

もうひとつ、constで配列や連想配列を操作する場合もエラーにはなりません。

const value=[1, 2];
console.log(value);
value.push(3);
console.log(value);

結果です。

タカヒロ

constの原則として再代入はできないとしていますが、できなくはないというところでしょうか。ちょっとややっこしいですね…

さいごに

いかがでしょうか。

今回は、

についてまとめました。

また、他にも便利な方法がありますので、よろしければご参照頂ければと思います。