【javascript】グローバルスコープとローカルスコープ（関数スコープ、ブロックスコープ）

スコープ周りをざっくり理解するための備忘録

グローバルスコープ

グローバルスコープであればどこからでもアクセスできる

var a = 'Global';// グローバルスコープの宣言
(function(){ // 即時関数　始まり
	console.log(a);// 出力：Global
})(); // 即時関数　終わり
console.log(a);// 出力：Global

ローカルスコープ

関数内で宣言をした場合は関数内でのみ扱えるローカルスコープになる

var a = 'Global';// グローバルスコープ
(function(){ // 即時関数　始まり
	var a = 'Local';// ローカルスコープ
	console.log(a);// 出力：Local
})();// 即時関数　終わり
console.log(a);// 出力：Global

関数スコープ（ローカルスコープ）

従来のローカルスコープ
function(){…}を使ったやつ
変数宣言varを筆頭にes6(ES2015)から追加されたletやconstも使える

「ローカルスコープ＝関数スコープ」という考えでok
※書き方は上記と同じなので省略

ブロックスコープ（ローカルスコープ）

es6(ES2015)から追加されたスコープ
{…}波括弧で囲む（{…}だけでもok）
※if文やfor文もブロックスコープに当たる（詳しくはこちら）
varを使うとグローバルスコープでブロックスコープにはならない
letやconstを使うとブロックスコープ（ローカルスコープ）になり、外からアクセスできなくなる

ブロックスコープ例

let a = 'Global';// グローバルスコープ
{ // ブロックスコープ　始まり
	let a = 'Local';// ローカルスコープ(ブロックスコープ)
	console.log(a);// 出力：Local
} // ブロックスコープ　終わり
console.log(a);// 出力：Global

varを使うとグローバルスコープが汚染される

var a = 'Global';// グローバルスコープ
{ // ブロックスコープ　始まり
	var a = 'Local';// ローカルスコープ(ブロックスコープ)
	console.log(a);// 出力：Local
} // ブロックスコープ　終わり
console.log(a);// 出力：Local←汚染される