6.javascript,スコープ
スコープとは、変数の有効範囲のことです。
javascriptでは、関数スコープとグローバールスコープがあります。
では、グローバルスコープから見ていきます。
var x = 1; var print = function(value){document.write(value)}; function test(){ print(x); } // 実行結果 1
関数の外に宣言した変数は全てグローバル変数になります。
なので、関数test内でも、xの値が出力されます。
では、関数スコープを見ていきます。
関数スコープ
関数内で宣言した変数は、関数内でのみ有効になります。
サンプルを見ます。
var print = function(value){document.write(value)}; var x = 1; function test(){ var x; // 関数内でグローバル変数と同じ名前の変数を宣言すると、関数内の変数が優先される print(x); // なのでundefinedが出力される } print(x); // ここは、グローバル変数が表示される // 実行結果 undefined 1
関数内で、宣言されたxは値が代入されていないので、表示するとundefinedになります。
一方関数外でxを出力すると、グローバル変数のxの値が表示されるので、1が表示されます。
ブロックスコープ
ブロックスコープは{}内で囲まれた範囲のことです。
このブロックスコープ内では、独自の変数にはなりません、サンプルを見ます。
var print = function(value){document.write(value)}; function test(){ for(var i = 0;i < 10;++i){ } print(i); // スコープを抜けるが10と表示される } 実行結果 10
forで変数iはブロックスコープを抜けますが、forの後も変数が生きている為、10と表示されます。
ブロックスコープ内でのみ変数を有効にする
ブロックスコープ内でのみ変数を有効にするには
letを使用します
letはchromeだとまだ有効になっていないので、chrome://flagsに飛び、javascriptの試験運用機能を有効にするをクリックし、
strictモードを宣言しないと使用することができません。
サンプルを見ます。
"use strict"; var print = function(value){document.write(value)}; function test(){ for(let i = 0;i < 10;++i){ } print(i); // iは定義されていないのでエラーになる }
for内で定義した変数iはforブロック内のみ有効になったので、
外で変数を参照することができなくなりました。