【JavaScript】知ってた? 変数にvar付けないとグローバルスコープになるって!!

JavaScript

リーダブルコード読んでて結構衝撃的だったので記事にしました。

サンプルコードも書いて実際に動きを確認したので知らなかった人はぜひ覚えてください。

 

 

変数にvar付けないとグローバルスコープになる

まあ、タイトルのままです。

 

変数宣言するのにvar付けない事はないので知らなかったですが、var付けなくてもエラーにならないのでミスでvarを付けないばかりに知らず知らずグローバルスコープになってしまいます。

 

ちなみに最近だとvarではなくlet, constを使うのがいいでしょう。

Qiitaに良い記事があるので参考までに。(変数の巻き上げもあります)

JavaScript var/let/constによる変数宣言 - Qiita
プログラム未経験の知人にJavaScriptを教えていた所、「varとletとconst、何が違くて、どう使い分ければいいのかわからない」と言われ、私なりにもう一度深く調べたので、上記についてまとめます。 var(変数) 再宣言...

 

サンプルコード

ということでサンプルコードでvarを付けない場合、グローバルスコープになるか確認してみます。

 

gistfa428d5875ad80df2cc64eaec1a4bb06

 

6行目の初期化’i=0’にvarを付けてないのでグローバルスコープになるため15行目で参照できます。

 

動作確認

それでは早速ブラウザで見てみると、このようにalertに10と表示されますね。

f:id:ksakae1216:20190326094354p:plain

 

次に、6行目を’var i=0’に修正して実行すると・・・

f:id:ksakae1216:20190326094907p:plain

15行目で’i’が未定義だと怒られました。

 

javascriptは手軽に書けますが、こうゆうところがふわっとしてるので大きめのプログラムでバグが出たりすると結構苦労した経験があります。

 

変数にはvarあるいは、let, constを付けましょう。

あと、これ以外にもプログラム書く上で参考になることがたくさんあるのでリーダブルコードを読むのはおすすめですよ。

※40過ぎて初めて読みますが結構勉強になります。

 

コメント

タイトルとURLをコピーしました