[JS]宣言されていない変数に何かを代入すると、グローバル変数として扱われる件

サンプルコード

とあるエラーにはまって色々調べたら、JavaScriptでは、宣言されていない変数に代入をすると、グローバル変数が作成される、ということを知ったので、サンプルコードとともに共有しておきます。

グローバル変数,ローカル変数,未宣言変数への代入

const a = 1; //グローバル変数を宣言した変数に代入
b = 2; // 未宣言の変数に代入

(function(){
    const c = 3; // ローカル変数を宣言した変数に代入
})();

// それぞれを出力
console.log(a);
console.log(b);
console.log(c);

このコードでは、「a」「b」「c」にそれぞれ「1」「2」「3」を代入しています。
それぞれの変数は、「グローバル変数宣言済み」「未宣言」「ローカル変数宣言済み」となっています。実行してみると…

実行結果

1
2
Uncaught ReferenceError: c is not defined at window.onload

このようになります。
3行目のローカル変数が出力されないのは分かりますが、実は未宣言の2行目は普通にグローバル変数として扱われています。

未宣言の変数は警告も出ない

ご存知の通り、未宣言変数はエラーの潜在的な原因になり得ることから、わざと未宣言変数に代入して、グローバル変数に使う…というのは望ましくない。
しかし、誤って書いてしまった場合、警告も何も出ずに処理されてしまうので、気がつきにくいなと思いました。
対策としては、「use strict」で厳格モードにするなどして、対応すると良いそうな。

厳格モードについては、こちらに書いています。