なぜJavaScriptでVarが使われなくなったのか？

今回は、JavaScriptのvarとletとconstの違いについて紹介していきたいと思います。

ちなみにタイトルにもある通り、JavaScriptのvarは現在使われなくなっています。

その理由の一つは、値の再定義ができてしまうことです。

var a = 1;

var a = 2;

console.log(a) // 2

これをletやconstで行う事は出来ません。

//letの場合

let a = 1;

let a = 2;

console.log(a)
//Uncaught SyntaxError: Identifier 'a' has already been declared

//constの場合

const a = 1;

const a = 2;

console.log(a)
//Uncaught SyntaxError: Identifier 'a' has already been declared

では、letとconstでは何が違うのか。

letは、変数なので値を再代入することが可能です。
constは、定数なので値を再代入する事が出来ません。

//letの場合

let a = 1;

a = 2;

console.log(a) // 2

//constの場合

const a = 1;

a = 2;

console.log(a)
//uncaught Typeerror: Assignment to constant variable.

上記のようにconstに値を再代入するとエラーが返ってきます。
数行の文を書く上では問題ないかまれませんが、何万行という文字を書く上でvarを使うのは、危険だというのは、容易に想像できます。

他にもvarが使われなくなった理由として、次のような例があります。

//letの場合

a = 1;

console.log(a)

let a

// ReferenceError: Cannot access 'a' before initialization

//constの場合

a = 1;

console.log(a)

const a

// ReferenceError: Cannot access 'a' before initialization

//varの場合

a = 1;

console.log(a)

var a

// 1

varを使うことで、定義する前に値を代入する事ができてしまいます。

もう一つvarが使われなくなった理由として、次のような例があります。

var a = 0

if(true){
  var a = 10
  var b = 20
  //①
  console.log(a) 
}

//②
console.log(a) 
//③
console.log(b)

3つのconsole.logの出力は以下のようになります。

①=10
②=10
③=20

上記のコードにおいて、varをconstまたはletで置き換えて考えると、
if文の中でのaの値なので、①＝10
if文がtrueにならないので、②=0
if文がtrueにならないのに加えて、if文の外でbは定義されていないので、③はエラー表示になるはずですが、varを使った場合は、if文のような構文をすっ飛ばしてしまうので、上記のような結果になります。これもバグを生む原因になりうると言えます。

以上、varがJavaScriptで使われなくなっている理由でした。