JS判断变量是否存在或已定义

阳光下的向日葵 / 2023-08-30 / 原文

前言：因需求修改了公共文件，导致引入公共文件的部分页面因未引入来源js会报错，所以需要在公共文件中增加判断变量是否存在。

为了确保代码的可靠性，应该对变量的定义进行检查，从而避免代码在运行时执行错误或不可预期的错误。

一、typeof

if (typeof myVar === 'undefined') {
  // myVar (未定义) 或 (已定义但未初始化)
} else {
  // myVar (已定义和已初始化)
}

二、使用try/catch

// missingVar 未定义
try {
  missingVar;
  console.log('missingVar 已定义')
} catch(e) {
  e; // => "ReferenceError: missingVar is not defined"
  console.log('missingVar 未定义');
}
// logs 'missingVar 未定义'

三、使用in运算符

in运算符被用来检测对象是否包含某个属性，如果变量未定义，则in运算符将返回false。

var obj = {};
if ('x' in obj) {
    console.log("x is defined in obj");
} else {
    console.log("x is not defined in obj"); //输出 "x is not defined in obj"
}

四、使用undefined关键字

undefined是JavaScript中一个特殊的关键字，代表着未定义的值。如果变量未定义，则可以通过检查变量是否等于undefined来判断变量是否已经定义。

var x;
if (x === undefined) {
    console.log("x is undefined");
}

结合：

var x;
if (typeof x !== 'undefined' && x !== null) {
    console.log("x is defined");
} else {
    console.log("x is undefined");
}

五、使用window对象

在浏览器中，全局变量都是window对象的属性。可以通过检查window对象是否包含该变量的属性来判断变量是否已经定义。

if (window.x) {
    console.log("x is defined");
} else {
    console.log("x is undefined");
}

六、window.hasOwnProperty()

每个全局变量都存储为全局对象的一个属性（window在浏览器环境中，global在 NodeJS 中）。

可以用来确定是否定义了全局变量myGlobalVar：

只需检查全局对象是否存在相应的属性：window.hasOwnProperty('myGlobalVar') 这种方法对于检查浏览器是否支持 web API 很有用。

var变量和function声明，当在最外层范围（也称为全局范围）中使用时，会在全局对象上创建属性：

// 外部范围
var num = 19;
function greet() {
  return 'Hello!';
}
window.hasOwnProperty('num');   // => true
window.hasOwnProperty('greet'); // => true

但是，请注意，const和let变量，以及class声明不会在全局对象上创建属性：

// 外部范围
const pi = 3.14;
let message = 'Hi!';
class MyClass {}
window.hasOwnProperty('pi');      // => false
window.hasOwnProperty('message'); // => false
window.hasOwnProperty('MyClass'); // => false