JavaScript では、どこでも変数を宣言できますが、場所が異なると、スコープと呼ばれる変数を使用できるスコープに影響します。スコープは、グローバル スコープとローカル スコープの 2 種類に大別できます。分けて紹介しましょう。
コンテンツ
表示
JS グローバル スコープ
グローバル スコープとは、現在のスクリプトのどこからでも変数にアクセスできることを意味します。グローバル スコープを持つ変数は、「グローバル変数」とも呼ばれます。一般に、次の特性を持つ変数はグローバル スコープを持ちます。
- 最も外側の関数と、最も外側の関数の外側で定義された変数には、グローバル スコープがあります。
- 直接代入のないすべての変数にはグローバル スコープがあります。
- window オブジェクトのすべてのプロパティには、window.name、window.location、window.top などのグローバル スコープがあります。
サンプルコードは次のとおりです。
var str = "こんにちは世界!";
function myFun(){
document.write(str); // 出力:こんにちは世界!
}
myFun();
document.write(str); // 出力:こんにちは世界!
実際には、次の例に示すように、グローバル スコープを持つすべての変数がウィンドウ オブジェクトにバインドされ、ウィンドウ オブジェクトのプロパティになります。
var str = "JavaScript";
document.write(str); // 出力:JavaScript
document.write(window.str); // 出力:JavaScript
document.write(str === window.str); // 出力:true
JS ローカル スコープ
関数内で宣言された変数には、ローカル スコープがあります。ローカル スコープを持つ変数は、「ローカル変数」とも呼ばれます。ローカル変数は、そのスコープ内 (関数内) でのみ使用できます。サンプルコードは次のとおりです。
function myFun(){
var str = "こんにちは世界!";
document.write(str); // 出力:こんにちは世界!
}
document.write(str); // エラー:str は定義されていません
関数で定義されたローカル変数は、関数が呼び出されたときにのみ生成され、関数が実行された直後に破棄されます。
「 JS スコープ (グローバルスコープ + ローカルスコープ)」についてわかりやすく解説!絶対に観るべきベスト2動画
14. グローバル変数とローカル変数 | 中学生でもわかるPython入門シリーズ
JavaScript実践:ローカル変数とグローバル変数|lynda.com 日本版