JavaScriptの変数のスコープについて学ぶ

最新特集【一覧】

防水スピーカーをワイヤレス化、お風呂でのんびり音楽を楽しむ

自作バーコードで音楽CDを管理する

Perfumeが公開したダンスのモーションデータをChromeで扱う

function test() {
   for (var i = 0; i < 10; i++) {
     // ブロック内でjを宣言
     var j = i;
   }
   // ブロックの外なので、jにはアクセスできない？
   alert(j);
}

　上のコードで、「ブロックの外なので、jにはアクセスできない？」とコメントされている部分は、実際にはアクセスできます。これは、前述した「ブロックスコープが存在しない」ということによるものです。

　さらに正確を期して言うなら、この挙動は「関数内のローカル変数は、全て関数の先頭で宣言されたことになる」というルールによるものです。このルールに則ると、上のコードは以下のように書き換えることができます。

function test() {
  // 関数の先頭でローカル変数を全て宣言
  var i, j;
  for (i = 0; i < 10; i++) {
    j = i;
  }
  alert(j);
}

　おわかりいただけましたか？これはつまり、「一つの関数は、一つのスコープとのみ対応している」と言い換えることができます（この言葉は、次回の記事への布石です）。

では以下の関数fを実行すると、どんな値がアラート表示されるでしょう？

var v = "global";
function f() {
  alert(v);
  if (!v) {
    var v = "local";
  }
}

　答えは……

　"undefined"です。if文の中で、vがローカル変数として宣言されていることに注意してください。

今回のまとめ

　今回は、今更ながら変数のスコープについてお話ししてみました。が、最後に紹介したTIPSに関してはは、ご存じなかった方も多いのではないでしょうか。

　しかし、変数のスコープに関する話題はまだ終わりではありません。次回はさらに踏み込んで、「スコープチェイン」に関するお話をしてみたいと思います。乞うご期待！