こんにちは、webエンジニア歴6年のtakaです。

今回はjavascriptにおいてよくvarを利用するなと言われますが、厳密になぜ利用していないか説明できますか？

早速いってみましょう。

変数の汚染

グローバルスコープなvar←バグが起こりやすい

以前のjavascriptではvarのみが利用されていましたが、varのスコープはグローバルなため使いにくいものでした。

そのためletやconstなどのスコープがローカルののものが出始めてきます。

まずスコープのグローバル・ローカルがどういうことかをみていきましょう。

var category = "book";
let color = "red";

if(true) {
 var category = "shop";
 let color = "blue";
}

console.log(category); // shop
console.log(color); // red

if文の中で再定義した際スコープ外、varは上書きができますが、letは上書きができないです。
このvarが上書きができていることが変数の汚染と呼ばれるという問題となっています。

一見グローバルスコープは融通が効き便利そうに見えますが、意図しない箇所で変数の値がおかしくなり大いにバグの原因になります。

ちなみに let color = “blue”;はif文の中でのみ利用な変数になります。

再定義が可能なvar←バグが起こりやすい

またvarは同じスコープ内で再定義が可能になっています。

var category = "book";
let color = "red";

var category = "shop"; // エラーが起こらない
let color = "blue"; // エラーが起こる

一見エラーが起こるletの方が良くないように見えますが、エラーが起こるということは開発段階でうまくいっていないためうまくいくようにしっかり修正してリリースできます。

varはエラーが起きないので文法上間違っていないが、本来行いたい処理がうまくいかない可能性を秘める状態になってしまうつまりバグの原因になります。

これらのことからバグの要因になりやすいvarは利用しない方が良いです！

まとめ

今回はvarを利用してはいけない理由をまとめました。

これでエンジニアとして一つ進歩ですね。

これと似た話で変数の型も、PHPのような動的型付け言語よりTypeScriptやGOのような静的型付け言語の方がより巨大なプロジェクトで好まれています。

より巨大なプロジェクトで好まれているということは、そのプロジェクトを運営している会社も大きく、給料も高いというわけで、そのためTypeScriptやGOが近年人気になってきています。