引き続きこちらの本の4.3.3章を:
改訂新版JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで
- 作者: 山田祥寛
- 出版社/メーカー: 技術評論社
- 発売日: 2016/09/30
- メディア: 大型本
- この商品を含むブログを見る
すごく面食らった現象?仕様?に遭遇しました。以下のコードを実行するとコンソールにどのような結果が出力されると思いますか?
1 var language = 'ja'; 2 3 function getLanguage () { 4 console.log("language inside function: " + language); 5 return language; 6 } 7 8 getLanguage();
答えは"language inside function: ja"です。 では、1行、追加するとどうでしょうか:
1 var language = 'ja'; 2 3 function getLanguage () { 4 console.log("language inside function: " + language); 5 var language = 'en'; 6 return language; 7 } 8 9 getLanguage();
先程と同じ結果と思いきや、結果はundefined
でした。
まだ完全に理解できてないのですが、ローカル変数を定義すると、その変数は関数の中の位置を問わず有効になります。
つまり、2つ目のサンプルの4行は実は、ローカルスコープの変数を参照しているのです。
4行目の結果が、その後の5行目の存在で影響を受けています!
参照しているのだけど、値がまだ未設定なのでundefined
なのですね。
Javascript、変態ですね。