Edited at

var/let/constの使い分けのメモ


グローバルスコープ


  • トップレベルに変数や関数を置くと、それはどこからでもアクセスできるグローバルオブジェクトになる

  • 別のJSファイルに書いたとしても、同様にグローバル扱いになる


関数スコープ


  • functionの中に書かれた変数・関数はその内部でしか変更・参照はできない

  • 外部から参照できないので変更に強いモジュールが作れる


var


  • 巻き上げがおきる


    • JavaScriptは関数内のどこでもvarの宣言を書ける

    • 関数のどこで宣言しても、先頭で定義したものとしてみなされる

    • 先頭部分で使いたい変数は全て定義するのが定石



  • 関数スコープである


    • 関数内ならどこからでも参照できる



var pokemon = 'ライチュウ';

function sing(){
//JavaScriptは関数内のどこでもvarの宣言を書ける
//これらの変数は関数のどこで定義しても、先頭で定義したものとして見なされる
//var pokemon;
console.log(pokemon);
var pokemon = 'ピカチュウ';
console.log(pokemon);
}
sing();


let


  • ブロックスコープ

  • 今までvarで書いてきた所はletで置き換えられる

  • if,for等の{}内のブロックのみで使うブロックスコープが作れるので、スコープを狭く出来るため影響範囲を狭められる

  • 変数の巻き上げは従来どおり起きる

if (true) {

//if内はスコープが無いのでグローバルスコープ扱い
var test = 'hoge';
}

//ブロックスコープではないので、アクセスできる
console.log(test);

if (true) {
//ブロックスコープになる
let test2 = 'hoge2';
}

//アクセスできない
console.log(test2);


const


  • 再代入不可能な変数を作る (つまり定数にできる)

  • 再代入しようとするとエラーになる

  • letと同じブロックスコープ

  • 巻き上げは起きる

  • ほとんどは再代入は不要なのでconstを使う

  • constを使っておけば値が変わることが無いので、値が変わるかも?という懸念が無くてコードが読みやすい

  • forのイテレータのような再代入が必要な所のみletを使う

const test3 = 'hoge';

test3 = 'fuga'; //エラー

console.log(test3);