题 JavaScript检查变量是否存在(定义/初始化)


检查变量是否已初始化的哪种方法更好/更正? (假设变量可以包含任何内容(字符串,整数,对象,函数等))

if (elem) { // or !elem

要么

if (typeof(elem) !== 'undefined') {

要么

if (elem != null) {

1288
2018-02-25 03:44


起源


我很惊讶我没有看到:'if(!! variable)'在这里。有什么理由不推荐这个吗? - JasoonS
if(!! variable)' - 不推荐当变量=== 0 - '(!!变量)'将返回true - iMysak
@JasoonS如果未定义/初始化变量,它将抛出异常。 - Alex
如果你想知道是否 foo 也宣布了 typeof foo === 'undefined' 要么 typeof foo === typeof undefined - vaxquis
进一步到@iMysak评论,如果你使用“if(variable)”和“variable”为0,那将评估为false,我只花了一个小时追逐这个,这样一个愚蠢的错误 - Chris


答案:


你要 typeof 操作者。特别:

if (typeof variable !== 'undefined') {
    // the variable is defined
}

2509
2018-02-06 04:56



这看起来是一个很好的解决方案,但你能解释为什么这个有效吗 - Morgan Cheng
实际上,您应该检查对象是否是您需要的对象。那就是if(typeof console =='object'){//变量就是我需要的} - staticsan
@George IV:“只做`if(变量)” - 嗯,不,失败的假和0。 - Jason S
'if(variable)'也无法测试对象属性的存在。 - scotts
@ geowa4实际上,如果变量未定义,则会抛出错误。 - mc10


typeof operator将检查变量是否确实未定义。

if (typeof variable === 'undefined') {
    // variable is undefined
}

typeof 与其他运算符不同,运算符不会抛出 引发ReferenceError 与未声明的变量一起使用时的异常。

但请注意 typeof null 将返回 "object"。我们必须小心避免将变量初始化为错误 null。为了安全起见,这是我们可以使用的:

if (typeof variable === 'undefined' || variable === null) {
    // variable is undefined or null
}

有关使用严格比较的更多信息 === 而不是简单的平等 ==,见:
应该在JavaScript比较中使用哪个等于运算符(== vs ===)?


694
2018-06-28 16:00



if(!variable_here){//你的代码在这里。 };无法判断变量是假还是未定义 - boh
if(! variable_here) 在许多情况下会破裂。如果变量为0或false,则失败。那不是你想要的。 - Cory Danielson
无法决定是否投票。严格来说 typeof foo === "undefined" 是正确的,并且比最高投票的答案更好,但附加说明只是让这个答案混乱。 - Alnitak
这怎么不是重复的 stackoverflow.com/a/519157 ? - Steven Penny
@StevenPenny现在是。它开始时差别很大,然后OP编辑它直到它现在几乎相同。 - ZAD-Man


在JavaScript中,可以定义变量,但保留该值 undefined,所以最常见的答案在技术上并不正确,而是执行以下操作:

if (typeof v === "undefined") {
   // no variable "v" is defined in the current scope
   // *or* some variable v exists and has been assigned the value undefined
} else {
   // some variable (global or local) "v" is defined in the current scope
   // *and* it contains a value other than undefined
}

这可能足以满足您的目的。以下测试具有更简单的语义,这使得更容易精确描述代码的行为并自己理解(如果您关心这些事情):

if ("v" in window) {
   // global variable v is defined
} else {
   // global variable v is not defined
}

当然,这假设您在浏览器中运行(其中 window 是全局对象的名称)。但是,如果你正在使用像这样的全局变量,你可能在浏览器中。主观上,使用 'name' in window 在风格上与使用一致 window.name 引用全局变量。访问全局变量作为属性 window 而不是变量允许您最小化您在代码中引用的未声明变量的数量(为了linting的好处),并避免全局被局部变量遮蔽的可能性。此外,如果全球性使你的皮肤爬行,你可能会感觉更舒服只用这个相对长的棍子接触它们。


182
2017-10-22 15:47



从技术上讲,这是最完整的答案,谢谢! - crabCRUSHERclamCOLLECTOR
这仅检查变量是否全局声明。如果您正确编码,那么您将限制您的全局变量。它将为本地变​​量报告false :( function(){var sdfsfs = 10; console.log(在窗口中为“sdfsfs”);})()` - Eddie Monge Jr
这是最好的f $#%%答案。我试图弄清楚如何解释这个问题 究竟 这个角落的情况。辉煌。不知道你能做到这一点。 - Aerovistae
单挑:您的答案已从此处迁移 stackoverflow.com/questions/519145/... - Shog9♦
它是否只适用于全局变量或本地声明(例如在循环内)? - Barth Zalewski


在大多数情况下,您将使用:

elem != null

不像简单 if (elem),它允许 0falseNaN 和 ''但拒绝 null 要么 undefined对参数的存在或对象的属性进行一般性测试。


其他检查也不正确,它们只是有不同的用途:

  • if (elem):如果可以使用 elem 保证是一个对象,或者如果 false0被视为“默认”值(因此相当于 undefined 要么 null)。

  • typeof elem == 'undefined' 可以在指定的情况下使用 null 对未初始化的变量或属性具有明显的含义。

    • 这是唯一的检查 不会抛出错误 如果 elem 不是 声明 (即没有 var 声明,而非财产 window,或不是函数参数)。在我看来,这是相当危险的,因为它允许错别字被忽视。要避免这种情况,请参阅以下方法。

同样有用的是严格的比较 undefined

if (elem === undefined) ...

但是,因为全球化 undefined可以用另一个值重写,最好声明变量 undefined 在使用它之前的当前范围:

var undefined; // really undefined
if (elem === undefined) ...

要么:

(function (undefined) {
    if (elem === undefined) ...
})();

这种方法的第二个优点是JS minifiers可以减少 undefined 变量为单个字符,每次节省几个字节。


112
2018-02-25 03:48



我很震惊,你可以覆盖 undefined。我甚至认为在答案中值得一提。可能是所有Javascript中唯一可接受的最差变量名称。 - Cory Danielson
这会导致异常并要求您使用 window.在变量之前,如果在全局上下文中使用...这不是最好的方法。 - Alex W
由于这个压倒一切的问题,你应该总是使用 void(0) 代替 undefined。 - Barth Zalewski
+1,因为这个答案指出有时你可能实际上 想 识别 false, 0等等作为无效值。 - rinogo


在许多情况下,使用:

if (elem) { // or !elem

会为你做这个工作!...这将检查以下案例:

  1. 未定义:如果没有定义值,那就是 undefined
  2. 空值:如果它为null,例如,如果DOM元素不存在...
  3. 空字符串'' 
  4. 0:数字零
  5. 为NaN:不是数字

所以它将覆盖所有情况,但总有一些奇怪的情况,我们也想覆盖,例如,一个带空格的字符串,像这样 ' ' 一,这将在javascript中定义,因为它在字符串中有空格...例如,在这种情况下,你使用trim()添加一个检查,如:

if(elem) {

if(typeof elem === 'string' && elem.trim()) {
///

此外,这些检查是为了  只是,因为对象和数组在Javascript,空数组中的工作方式不同 [] 和空对象 {} 总是 真正

我创建了下面的图像,以显示答案的简要说明:

undefined, null, etc


85
2017-09-01 06:15



惊人的插图。你得到了我的投票 - oBo
在检查空数组时,第一种情况是否合适? - Thiago Yoithi
@ThiagoYoithi,是的,你需要在这种情况下传递Array.length,当它为空时为0,如if(myArray.length){...} - Alireza
是的,但我想知道这种方法的行为:让arrayVar = []; if(arrayVar)//这个条件的结果是true还是false? - Thiago Yoithi
@Alireza,真好!你的答案将帮助很多人。我已经记住了这些虚假的价值观,我唯一不确定的是[]。 - Thiago Yoithi


如何检查变量是否存在

这是一个非常灵活的解决方案,用于测试变量是否存在并已初始化:

var setOrNot = typeof variable !== typeof undefined;

它最常用于与a组合使用 三元运算符 如果某个变量尚未初始化,则设置默认值:

var dark = typeof darkColor !== typeof undefined ? darkColor : "black";

封装问题

不幸的是,你不能简单地将你的支票封装在一个函数中。

您可能会想到这样的事情:

function isset(variable) {
    return typeof variable !== typeof undefined;
}

但是,如果您正在调用eg,则会产生引用错误。 isset(foo) 和变量 foo 尚未定义,因为您不能将不存在的变量传递给函数:

未捕获的ReferenceError:未定义foo


测试函数参数是否未定义

虽然我们的 isset 函数不能用于测试变量是否存在(由于上面解释的原因),它允许我们测试函数的参数是否未定义:

var a = '5';

var test = function(x, y) {
    console.log(isset(x));
    console.log(isset(y));
};

test(a);

// OUTPUT :
// ------------
// TRUE
// FALSE

即使没有价值 y 传递给函数 test, 我们的 isset 函数在这种情况下完美地工作,因为 y 在功能上是众所周知的 test 作为一个 undefined 值。


59
2018-02-19 11:54



@ChristophAlrich:哎呀。感谢您指出了这一点。我修正了我的答案:-) - John Slegers


检查是否有物体 hasOwnProperty()

过多的替代品 typeof 答案,就是使用 hasOwnProperty() 当然,它检查一个对象(JS中几乎所有东西)是否都有属性  一个变量(除其他外)。

hasOwnProperty() method返回一个布尔值,指示对象是否具有指定的属性作为自己的(不是继承的)属性。

每个物体都来自 目的 继承了 hasOwnProperty() 方法。此方法可用于确定对象是否具有指定的属性作为该对象的直接属性;不像  运算符,此方法不会检查对象的原型链。

// Globally established (therefore) properties of window
var foo = "whatever", // string
    bar = false,      // bool
    baz;              // undefined
// window.qux does not exist

console.log( [
    window.hasOwnProperty( "foo" ),             // true
    window.hasOwnProperty( "bar" ),             // true
    window.hasOwnProperty( "baz" ),             // true
    window.hasOwnProperty( "qux" ),             // false
    { foo: [], bar: 0 }.hasOwnProperty( "bar" ) // true
] );

什么是好的 hasOwnProperty() 就是在调用它时,我们不使用可能尚未定义的变量 - 这当然是问题的一半。

虽然没有 总是 该 完善 要么 理想 解决方案,在某些情况下,这只是工作!


42
2018-05-02 14:07



这是一个很棒的替代方案,应该是这个问题的最高评价。请使用返回的工作示例简化答案标题 true (例如。 window.hasOwnProperty('console') 要么 var hop = "p";window.hasOwnProperty('hop'))。 - CPHPython
无需定义用于解释的功能,人们将立即理解它,并且简短的回答更快阅读。如果您仍想留下片段,只需在其上留下两行,第一行定义var,第二行打印结果。 - CPHPython
@CPHPython编辑;好的? - Fred Gandt
很好的改进,简单快速的理解,谢谢! - CPHPython
最后因为访问不存在的成员而不会引发错误的东西...所有的东西 typeof 答案只是忽略了。 - Zelphir