JavaScriptの変数のスコープとしては、下記があります。
- グローバルスコープ
- ローカルスコープ(「関数スコープ」とも呼ばれる。)
- ブロックスコープ(ECMA2015より追加されたスコープ)
グローバルスコープ
スクリプト全体から参照することができます。
グローバル変数
グローバルスコープを持つ変数のことです。要は、基本的には関数の外で定義した変数のことです。
グローバルスコープの注意点
他の開発者や他のライブラリと変数名が重なってしまうと誤動作の原因になります。どうしてもグローバルスコープじゃないと実現できないという場合を除きできるだけローカルスコープを使うようにしましょう。
ローカルスコープ(「関数スコープ」とも呼ばれる。)
定義された関数の中でのみ参照することができます。要は、基本的には関数の中で定義した変数のこと(後述するような例外はあります。)です。
また、関数の引数自体も、ローカルスコープである「ローカル変数」の扱いになります。
ローカル変数
ローカルスコープを持つ変数のことです。
「グローバル変数」と「ローカル変数」の使い分けの例
1 2 3 4 5 |
var global = 'グローバル変数です'; function test(){ var local = 'ローカル変数です。'; } |
なお、var命令をしなかった場合は、例外なく「グローバル変数」になってしまうので、少なくとも必ずローカル変数にはvar命令を付けるようにしましょう。
「ローカル変数」使用時の注意点
1 2 3 4 5 6 |
var hensu = 'グローバル変数です'; function test(){ console.log(hensu); var hensu = 'ローカル変数です。'; } |
上記のような場合は、出力結果は、「グローバル変数です」ではなく、「undefined(未定義)」になります。
これは、test関数内で、後ろの方にvarで「ローカル変数」の定義がされており、関数全体で有効になってしまっているためです。ただ、まだ代入はされていないため、「undefined」となります。
なので、ローカル変数を定義する際は、必ず関数の先頭で定義するようにしましょう。
ブロックスコープ(ECMA2015より追加されたスコープ)
Java等の言語でもそうですが、ifブロックや、forブロックの中だけで有効なスコープを持つ変数がJavaScriptでも定義できるようになりました。
今までは、JavaScriptでは、そのような機能はありませんでした。
この記事へのコメントはありません。