JavaScript の変数スコープで嵌る 1

問題

(function (a) {
  console.log("outer:" + a);
  (function () {
    console.log("inner:" + a);
    var a = "piyo";
  })();
})("hoge");

↓下と同義

(function (a) {
  console.log("outer:" + a);
  (function () {
    var a;
    console.log("inner:" + a);
    a = "piyo";
  })();
})("hoge");

結果 (出力)

outer: hoge
inner: undefined

結論

var キーワードを使い変数を宣言すると、その変数名では上位のスコープが参照されなくなるため、値が代入される前に参照すると undefined が返る。

ちなみに… var キーワードを取り払うと結果は次のようになる。

outer: hoge
inner: hoge

同じ変数名を使いまわす時は要注意。
変数はスコープの上の方で宣言しよう。