JavaScript バーロー！変数定義、varとletの違いをまとめてみた

JavaScriptの変数定義、varとletの違いをまとめてみた：イントロ

　

JavaScriptを使う上で変数定義がvarとletがある。
その違いとどちらを使うべきを書いていこうと思います。
ちなみにバーローについては、某探偵少年の名セリフとvar、let(ばー、れっと）をかけてるだけです。。。。むりやりですが（笑)

まず変数を宣言するとは

　

・ざっくりですが値を格納するための領域を確保する
・変数を利用するための宣言

といったところです。
下記の様に宣言します。

　

var hensuu1 = 1;       // varの変数定義
let hensuu2 = "変数";　// letの変数定義

本題！varとletの違い

　

上記のように宣言できるのを見ると違いがない様に見えますが、
大きな違いとしては、letの方がES2015という最近追加された機能で、
letの方がコードの保守性が良いように思います。

違いを下記にまとめていきます。

■　相違点 　■###

①変数の重複許容　var => 許す　let => 許さない

varは変数の重複を許容しますが、letは許容しません。

var hensuu = "変数1";
var hensuu = "変数2";

console.log(hensuu); // 変数2と表示　最初の宣言は上書きされる

let hennsuu = "へんすう";
let hennsuu = "へんすう２";
console.log(hennsuu); // Idemtifer 'hennsuu' has already been declardとエラーになる
　　　　　　　　　　　 // 変数'hennsuu'はすでに宣言済みです

　

なので
letを使った方が同じ名前の変数をうっかり使ってしまい、変数が予想外のものになったり、バグが発生しにくいと言えます。
　

②ブロックスコープの認識　var=>認識しない　let=>認識する

letの方がより細かく変数の有効範囲を管理できます。

なんとJavaScriptには、ブロックレベルのスコープが存在しません!!
(JavaやPHPなどの言語からすると驚きですよね。。。)

たとえばif文など

if (true) {
    var i = 1;
}

console.log(i); // 1と出力

この様に
ブロックを抜けたあとでも、変数iが有効になります。

これがletだとちゃんとスコープを認識します

if (true) {
    let i = 2;
}

console.log(i); // 変数iはスコープ外なのでエラーとなる

　

これは、良いですね！違和感がなくなります！

##　まとめ
　
varとletであればletを使ったほうが安全！！

しかし、letはES2015から利用できるものなので、環境を確かめてから使いましょう。
良いコードを書くためにlet's let!

。。。苦笑