如何简洁高效检测JavaScript & jQuery中多变量是否存在

嘿，这个问题我太有共鸣了——处理一堆变量的存在性检查确实很烦人，尤其是写一大串typeof的时候。直接用if(undefined_var1 && undefined_var2...)其实会报错，因为如果变量根本没声明，JavaScript会抛出ReferenceError，连typeof的机会都不给。不过咱们有几个更优雅的替代方案，一起来看看：

如果能把相关变量都放到一个对象里，检查逻辑会立刻简洁很多——因为访问对象不存在的属性只会返回undefined，不会抛出错误。

自定义对象场景 #

// 先把零散变量整合到一个对象里
const appState = {
  userInfo: undefined_userInfo,
  config: undefined_config,
  permissions: undefined_permissions
};

// 简洁检查所有属性是否已定义
if (Object.values(appState).every(val => val !== undefined)) {
  // 所有变量都就绪，执行你的业务逻辑
  renderUserPage(appState.userInfo, appState.config);
}

全局变量场景 #

浏览器环境下，全局变量本来就是window对象的属性，直接通过window访问即可安全检查：

// 不用写一大串typeof，直接检查window属性
if (window.userInfo !== undefined && window.config !== undefined) {
  initApp();
}

如果你的项目支持ES2020及以上语法，可选链?.和空值合并??可以帮你快速处理未定义变量，同时避免报错：

// 先给未定义的变量设置默认值（如果需要）
const userInfo = window.userInfo ?? { default: 'guest' };
const config = window.config ?? { theme: 'light' };

// 现在可以放心用&&判断变量是否有效
if (userInfo && config) {
  renderApp(userInfo, config);
}

如果还是要处理零散的局部变量（已经用let/var声明过，但可能未赋值），可以写个小工具函数批量检查：

// 批量检查变量是否已定义
function allDefined(...variables) {
  return variables.every(val => typeof val !== "undefined");
}

// 使用时直接传变量，代码瞬间清爽
if (allDefined(var1, var2, var3, var4)) {
  runComplexLogic(var1, var2);
}

注意：这个函数要求变量至少被声明过（比如let var1;），如果变量完全没声明，直接传进去还是会报错，这时候可以改成传变量名字符串，检查全局对象：

function allGlobalVarsDefined(...varNames) {
  return varNames.every(name => typeof window[name] !== "undefined");
}
// 使用：allGlobalVarsDefined('userInfo', 'config')

总的来说，最推荐的是把变量组织到对象里（或利用全局window），既避免了未声明变量的报错，又能让检查逻辑更易维护。如果是局部变量，先确保它们被声明，再用工具函数批量检查会省很多事。

内容的提问来源于stack exchange，提问作者user12914956