JavaScriptのグローバル変数未定義エラーの回避方法

はじめに

JavaScriptでは、未定義のグローバル変数へのアクセスでエラーを出力します。ここでは、エラーを回避して、未定義を判定する方法を考えます。

失敗例

下記のコード例では、グローバル変数の未定義エラーで失敗します。

if (a) {
  console.log('OK');
} else {
  console.log('NG');
}
// Uncaught ReferenceError: a is not defined

---

undefinedと比較if (a !== undefined) {
  console.log('OK');
} else {
  console.log('NG');
}
// Uncaught ReferenceError: a is not defined

※a = undefined;を事前に設定した場合、意図した動作となる。
　その場合、根本的に未定義ではなくなる。

回避策

window.property

if (window.a) {
  console.log('OK');
} else {
  console.log('NG');
}

※変数が「undefined」「null」「false」「0」「""」の場合、誤判定する。
　完全ではないがほとんどの場合、「window.a」「!window.a」でこと足りる。
※windowが存在しない環境の場合は、「window以外のグローバル変数」を参照

in window

if ('a' in window) {
  console.log('OK');
} else {
  console.log('NG');
}

※windowが存在しない環境の場合は、「window以外のグローバル変数」を参照

typeof

if (typeof(a) !== 'undefined') {
  console.log('OK');
} else {
  console.log('NG');
}

※typeof(a) === void 0では動作しない。
　typeof(a)は、undefinedのプリミティブ値ではなく、文字列を出力する。

try/catch

try {
  a;
  console.log('OK');
} catch (e) {
  console.log('NG');
}

備考

window以外のグローバル変数

上記の例でグローバル変数にwindowを使用しています。ですが、グローバル変数がwindowでないことがあります。windowを使用せずにグローバル変数を取得する方法は、次の通りです。

var global = Function('return this')();

window自身の有無を判定する

var global = Function('return this')();
if ('window' in global) {
  console.log('OK');
} else {
  console.log('NG');
}

※スコープ内に意図しないwindow変数がある場合、in globalが一番安全に判定できる。