JavaScriptでブロックスコープを定義する方法です。
ECMAScript5以前の環境では即時関数を使用しますが、
ECMAScript6からブロックスコープが簡単に定義できるようになりました。
ブロックスコープを定義する（ECMAScript6以降）
ECMAScript6以降でブロックスコープを定義するには、「{」、「}」で囲うだけです。
例）ブロックスコープを定義するサンプル
|
1 2 3 4 5 6 7 8 9 10 11 12 |
//aに100を代入・表示する var a = 100; document.write(a); //ブロックスコープ内のローカル変数aに200を代入・表示する { let a = 200; document.write(a); } //aを表示する document.write(a); |
- （結果）
- 100 200 100
解説
- ECMAScript6以降ではグローバル変数/ローカル変数を区別し、グローバル変数の定義はvar、ローカル変数の定義はletを使用します。
- なので、ブロック内でのみ有効な変数（ローカル変数）を定義する場合はletで定義します。
- ブロック内でvarで変数定義すると、グローバル変数を定義したことになります。
ブロックスコープを定義する（ECMAScript5以前）
ECMAScript5以前の環境でブロックスコープを定義するには、即時関数を使用します。
例）ブロックスコープを定義するサンプル
|
1 2 3 4 5 6 7 8 9 10 11 12 |
//aに100を代入・表示する var a = 100; document.write(a); //ブロックスコープ内のローカル変数aに200を代入・表示する (function(){ var a = 200; document.write(a); }()); //aを表示する document.write(a); |
- （結果）
- 100 200 100
解説
- ECMAScript5以前ではグローバル変数/ローカル変数を区別せず、変数定義はすべてvarで行います。
- 即時関数内でvar定義しても即時関数外の変数には影響しません。