JavaScriptでのグローバル変数の宣言方法

変数は、どの範囲からアクセスできるかによって２種類のスコープ（範囲）をもち、それぞれグローバル変数、ローカル変数と呼ばれます。JavaScriptでは、関数の外側で宣言した変数はグローバル変数として扱われ、プログラムのどこからでもアクセスすることができます。一方、関数の内側で宣言された変数はローカル変数として扱われ、宣言された関数内からのみアクセスできます。

ここでは、JavaScriptにおけるグローバル変数の宣言方法について説明します。

グローバル変数の宣言方法

次のプログラムは、関数の外側でグローバル変数xを宣言しています。このため、xはプログラムのどこからでもアクセス可能です。

var x = 0; // グローバル変数
function f(){
	console.log(x);
}
function g(){
	console.log(x);
}
f(); //0
g(); //0
console.log(x); //0

また、関数内であってもvarを使わずに宣言した変数はグローバル変数となります。

function f(){
	x = 0; // グローバル変数
	console.log(x);
}
function g(){
	console.log(x);
}
f(); //0
g(); //0
console.log(x); //0

ただし、バグの原因になりやすいので、変数はvarを使って宣言することが推奨されています。

グローバル変数とローカル変数が同じ名前を持つ場合、関数内ではローカル変数が優先されます。

var x = 0;
function f(){
	var x = 1;
	console.log(x);
}
f(); //1

グローバル変数を使う上での注意点

グローバル変数を宣言すると、その変数はグローバルオブジェクト（Webブラウザ環境の場合はwindowオブジェクト）のプロパティとして登録されます。このため、いわゆる予約語以外であっても、予めwindowオブジェクトに登録されているプロパティ名をグローバル変数として宣言すると、ブラウザによっては名前が衝突してうまく動かないことがあります。特にname(window.name)は変数名としてつけやすいので注意が必要です。