¿Cómo verificar una variable indefinida o nula en JavaScript?


500

Con frecuencia utilizamos el siguiente patrón de código en nuestro código JavaScript

if (typeof(some_variable) != 'undefined' && some_variable != null)
{
    // Do something with some_variable
}

¿Hay alguna manera menos verbosa de verificar que tenga el mismo efecto?

Según algunos foros y publicaciones que dicen simplemente lo siguiente debería tener el mismo efecto.

if (some_variable)
{
    // Do something with some_variable
}

Desafortunadamente, Firebug evalúa una declaración como error en tiempo de ejecución cuando some_variableno está definida, mientras que la primera está bien para eso. ¿Es esto solo un comportamiento (no deseado) de Firebug o hay realmente alguna diferencia entre esas dos formas?


46
if(some_variable) { ... }no se ejecutará si some_variablees falseo 0o ...
kennytm

buen punto;) Pero digamos que sé que no puede ser falso o 0 y solo quiero verificar si puedo usarlo en alguna lógica (como una cadena, matriz, etc.)
Tomas Vana


2
... o una cadena vacía.
David dado el

Respuestas:


333

Tienes que diferenciar entre casos:

  1. Las variables pueden ser undefinedo no declaradas . Obtendrá un error si accede a una variable no declarada en cualquier contexto que no sea typeof.
if(typeof someUndeclaredVar == whatever) // works
if(someUndeclaredVar) // throws error

Una variable que ha sido declarada pero no inicializada es undefined.

let foo;
if (foo) //evaluates to false because foo === undefined
  1. Propiedades indefinidas , como someExistingObj.someUndefProperty. Una propiedad indefinida no produce un error y simplemente devuelve undefined, que, cuando se convierte en un valor booleano, se evalúa como false. Entonces, si no te importa 0y false, usar if(obj.undefProp)está bien. Hay un idioma común basado en este hecho:

    value = obj.prop || defaultValue

    lo que significa "si objtiene la propiedad prop, asígnela value, de lo contrario asigne el valor predeterminado defautValue".

    Algunas personas consideran que este comportamiento es confuso, argumentan que conduce a errores difíciles de encontrar y recomiendan usar el inoperador.

    value = ('prop' in obj) ? obj.prop : defaultValue

1
Entonces podría hablar sobre hasOwnProperty y prototipos. 'indexOf' en []! == [] .hasOwnProperty ('indexOf')
Alsciende el

1
Sí, pensé en agregar esto, pero decidí sacrificar la integridad por brevedad. ;)
user187291

52
no abordas el problema de 0 y falso
TMS

12
Te refieres a variables no declaradas . Se puede declarar una variable pero aún tener un valor de undefined.
Tgr

1
Y también tenga en cuenta que typeofdevuelve una cadena. Entonces var myVar; typeof(myVar)==undefinedvuelve falseno true.
rism

417

Creo que la forma más eficiente de evaluar el "valor es nullo undefined" es

if ( some_variable == null ){
  // some_variable is either null or undefined
}

Entonces estas dos líneas son equivalentes:

if ( typeof(some_variable) !== "undefined" && some_variable !== null ) {}
if ( some_variable != null ) {}

Nota 1

Como se menciona en la pregunta, la variante corta requiere que some_variablese haya declarado; de lo contrario, se lanzará un ReferenceError. Sin embargo, en muchos casos de uso, puede suponer que esto es seguro:

verificar argumentos opcionales:

function(foo){
    if( foo == null ) {...}

buscar propiedades en un objeto existente

if(my_obj.foo == null) {...}

Por otro lado typeofpuede tratar con variables globales no declaradas (simplemente retorna undefined). Sin embargo, estos casos deberían reducirse al mínimo por buenas razones, como explicó Alsciende.

Nota 2

Esta variante, incluso más corta, no es equivalente:

if ( !some_variable ) {
  // some_variable is either null, undefined, 0, NaN, false, or an empty string
}

entonces

if ( some_variable ) {
  // we don't get here if some_variable is null, undefined, 0, NaN, false, or ""
}

Nota 3

En general se recomienda usar en ===lugar de ==. La solución propuesta es una excepción a esta regla. El verificador de sintaxis JSHint incluso proporciona la eqnullopción por este motivo.

De la guía de estilo jQuery :

Se deben usar verificaciones estrictas de igualdad (===) a favor de ==. La única excepción es cuando se comprueba si hay valores indefinidos y nulos a modo de nulo.

// Check for both undefined and null values, for some important reason. 
undefOrNull == null;

1
Diferencia muy importante (que ya se mencionó en la pregunta por cierto). Es por eso que todos usan typeof. Lo siento, pero no entiendo dónde es útil tu respuesta, solo dices lo que se dijo en la pregunta y en las primeras líneas lo dices incluso mal.
TMS

33
Lo siento, pero tengo que estar en desacuerdo ;-) El uso == nulles, en mi opinión, el más eficiente para probar 'nulo o indefinido' (que es el tema de las preguntas). De ninguna manera es poco común (usado 43 veces en jQuery 1.9.1), ya que muy a menudo sabe que la variable fue declarada, o prueba una propiedad de un objeto existente como if( o.foo == null).
mar10

1
@ mar10 (aUndefinedVar == null) le da un error "aUndefinedVar no está definido" no es cierto.
Rannnn

77
Gracias por esta sucinta opción. En el 99% de mi código no hay necesidad de distinguir entre nulo e indefinido, por lo tanto, la brevedad de esta verificación da como resultado un código menos desordenado.
Ian Lovejoy

1
Para evitar un error de referencia al verificar una variable global, use window.someProperty == null. Para las variables locales, puede asegurarse fácilmente de que estén declaradas: en lugar de escribir, if (...) {var local = ""}escribavar local; if (...) { local = ""; }
Aloso

66

Marcar nulo con igualdad normal también devolverá verdadero para indefinido.

if (window.variable == null) alert('variable is null or undefined');

JS Igualdad


44
NaN no es igual a Nan?
Sharjeel Ahmed

2
@monotheist NaN no es igual a NaN (vea la página de NaN de MDN ). Javascript usa IEEE-754 para su punto flotante que especifica estos comportamientos. Hay algunas ideas sobre esto, consulte stackoverflow.com/a/23666623/2563765
Steven

1
@SharjeelAhmed Está matemáticamente corregido. NaNde la ecuación de diferencia nunca se puede esperar que sea igual
Thaina

28

En los nuevos estándares de JavaScript, como ES5 y ES6, solo puede decir

> Boolean(0) //false
> Boolean(null)  //false
> Boolean(undefined) //false

todos devuelven falso, que es similar a la comprobación de Python de variables vacías. Entonces, si quieres escribir lógica condicional alrededor de una variable, solo di

if (Boolean(myvar)){
   // Do something
}

aquí "nulo" o "cadena vacía" o "indefinido" se manejarán de manera eficiente.


2
apoyado a me gusta ie5, ¿por qué esto no es más conocido?
Himmators

12
¡OP solo quería una prueba diferente nully undefined, otros valores falsos deberían devolver verdadero!
Andre Figueiredo

1
No agrega valor en un condicional. La condición se evalúa exactamente lo mismo y todavía devuelve false para 0, NaN. Esto es para cuando desea capturar la veracidad de un objeto sin mantener una referencia al objeto para que pueda almacenarlo en lugar de algún objeto potencialmente grande. FYI esto también es equivalente a!!value , que el primero !niega la veracidad, y el segundo lo niega nuevamente.
erich2k8

> FYI esto también es equivalente al valor !!, que es el primero! niega la veracidad. Qué FYI también es equivalente a if (var)cuál se convertirá en booleano, por lo que básicamente es completamente inútil ...
Cyril CHAPON

2
Si bien, literalmente, utiliza la palabra clave undefined , Boolean(undefined)funciona, intentar eso con una variable indefinida no funciona, y ese es el punto de hacer la verificación de nulo o indefinido. Esto: if (Boolean(undeclareVarName)) { console.log('yes'); } else { console.log('no'); }arroja un ReferenceError diciendo "ReferenceError: undeclareVarName no está definido"
Stephen P

22

Si intenta hacer referencia a una variable no declarada, se generará un error en todas las implementaciones de JavaScript.

Las propiedades de los objetos no están sujetas a las mismas condiciones. Si no se ha definido una propiedad de objeto, no se generará un error si intenta acceder a ella. Entonces, en esta situación, podría acortar:

 if (typeof(myObj.some_property) != "undefined" && myObj.some_property != null)

a

if (myObj.some_property != null)

Con esto en mente, y el hecho de que las variables globales son accesibles como propiedades del objeto global ( windowen el caso de un navegador), puede usar lo siguiente para las variables globales:

if (window.some_variable != null) {
    // Do something with some_variable
}

En ámbitos locales, siempre es útil asegurarse de que las variables se declaren en la parte superior de su bloque de código, esto ahorrará en los usos recurrentes de typeof.


11
Extrañará NaN, 0, "" y falso porque no son nulos ni indefinidos, sino también falsos.
Andreas Köberle

@Andreas Köberle tiene razón. Incluso el operador de igualdad no estricto dice que nulo es diferente de NaN, 0, "" y falso. Tendría que hacer if (myObj.some_property != null)para obtener un comportamiento equivalente.
thejoshwolfe 01 de

15

En primer lugar, debes ser muy claro sobre lo que pruebas. JavaScript tiene todo tipo de conversiones implícitas para dispararte, y dos tipos diferentes de comparador de igualdad: ==y ===.

Una función test(val)que prueba nullo undefineddebe tener las siguientes características:

 test(null)         => true
 test(undefined)    => true
 test(0)            => false
 test(1)            => false
 test(true)         => false
 test(false)        => false
 test('s')          => false
 test([])           => false

Veamos cuáles de las ideas aquí realmente pasan nuestra prueba.

Estos trabajan:

val == null
val === null || val === undefined
typeof(val) == 'undefined' || val == null
typeof(val) === 'undefined' || val === null

Estos no funcionan:

typeof(val) === 'undefined'
!!val

Creé un Creé entrada jsperf para comparar la corrección y el rendimiento. de estos enfoques. Los resultados no son concluyentes por el momento ya que no ha habido suficientes ejecuciones en diferentes navegadores / plataformas. ¡Tómese un minuto para ejecutar la prueba en su computadora!

En la actualidad, parece que la val == nullprueba simple ofrece el mejor rendimiento. También es prácticamente el más corto. Se puede negar la prueba val != nullsi desea el complemento.


12

Este es el único caso en el que se ==debe utilizar:

if (val == null) console.log('val is null or undefined')

3
Esta respuesta es alrededor de 2019 tiene una escasez de votos positivos, pero es la de KISS para este caso de uso. También val != nullpor lo contrario, solo uno = y dado que por @Yukulele es el ÚNICO que usará ==, sabrá qué hace cuando lo vea.
DKebler

7

Como no existe una respuesta única completa y correcta, intentaré resumir:

En general, la expresión:

if (typeof(variable) != "undefined" && variable != null)

no se puede simplificar, porque variablepodría no estar declarado, por lo que omitirlo typeof(variable) != "undefined"daría como resultado ReferenceError. Pero, puede simplificar la expresión según el contexto :

Si el variablees global , puede simplificarlo para:

if (window.variable != null)

Si es local , probablemente pueda evitar situaciones en las que esta variable no esté declarada y también simplificar para:

if (variable != null)

Si es propiedad de un objeto , no tiene que preocuparse por ReferenceError:

if (obj.property != null)

Es navigatorparte de window? Cuando tenemos una excepción navigator is not defined, ¿podemos usar la window.navigator != nullprueba?
jww

5

Simplemente puede verificar si la variable tiene un valor o no. Sentido,

if( myVariable ) {
//mayVariable is not :
//null
//undefined
//NaN
//empty string ("")
//0
//false

}

Si no sabe si existe una variable (es decir, si se declaró), debe consultar con el operador typeof. p.ej

if( typeof myVariable !== 'undefined' ) {
    // myVariable will get resolved and it is defined
}

4

He hecho esto usando este método

guardar la identificación en alguna variable

var someVariable = document.getElementById("someId");

luego usar si condición

if(someVariable === ""){
 //logic
} else if(someVariable !== ""){
 //logic
}

4

Este es un ejemplo de una ocasión muy rara en la que se recomienda usar en ==lugar de ===. La expresión somevar == nulldevolverá verdadero para undefinedy null, pero falso para todo lo demás (un error si la variable no está declarada).

El uso de !=invertirá el resultado, como se esperaba.

Los editores modernos no advertirán sobre el uso ==u !=operador connull , ya que este es casi siempre el comportamiento deseado.

Comparaciones más comunes:

undeffinedVar == null     // true
obj.undefinedProp == null // true
null == null              // true
0 == null                 // false
'0' == null               // false
'' == null                // false

Inténtalo tú mismo:

let undefinedVar;
console.table([
    { test : undefinedVar,     result: undefinedVar     == null },
    { test : {}.undefinedProp, result: {}.undefinedProp == null },
    { test : null,             result: null             == null },
    { test : false,            result: false            == null },
    { test : 0,                result: 0                == null },
    { test : '',               result: ''               == null },
    { test : '0',              result: '0'              == null },
]);

3

Como se menciona en una de las respuestas, puede tener suerte si habla de una variable que tiene un alcance global. Como ya sabrá, las variables que define globalmente tienden a agregarse al objeto de Windows. Puedes aprovechar este hecho, así que digamos que estás accediendo a una variable llamada bleh, solo usa el operador doble invertido (!!)

!!window['bleh'];

Esto devolvería un valor falso mientras bleh no se haya declarado Y se le haya asignado un valor.



2

lo que sea yyy es indefinido o nulo, devolverá verdadero

if (typeof yyy == 'undefined' || !yyy) {
    console.log('yes');
} else {
    console.log('no');
}

si

if (!(typeof yyy == 'undefined' || !yyy)) {
    console.log('yes');
} else {
    console.log('no');
}

No


2

Abra las herramientas de desarrollador en su navegador y solo pruebe el código que se muestra en la imagen a continuación.

Img1 Img2


2

Para entenderlo, analicemos cuál será el valor devuelto por el motor Javascript al convertir undefined, null y '' (una cadena vacía también). Puede verificar directamente lo mismo en su consola de desarrollador.

ingrese la descripción de la imagen aquí

Puede ver que todos se están convirtiendo en falso, lo que significa que estos tres suponen 'falta de existencia' por javascript. Por lo tanto, no es necesario que compruebe explícitamente los tres en su código como se muestra a continuación.

if (a === undefined || a === null || a==='') {
    console.log("Nothing");
} else {
    console.log("Something");
}

También quiero señalar una cosa más.

¿Cuál será el resultado de Boolean (0)?

Por supuesto falso. Esto creará un error en su código cuando 0 es un valor válido en su resultado esperado. Así que asegúrese de verificar esto cuando escriba el código.


2

Similar a lo que tienes, podrías hacer algo como

if (some_variable === undefined || some_variable === null) { do stuff }


0

Probar nulidad ( if (value == null)) o no nulidad ( if (value != null)) es menos detallado que probar el estado de definición de una variable.

Además, la prueba if (value)(o if( obj.property)) para garantizar la existencia de su variable (o propiedad del objeto) falla si se define con un falsevalor booleano . Advertencia emptor :)


0

Ambos valores se pueden distinguir fácilmente utilizando el operador de comparación estricto:

Ejemplo de trabajo en:

http://www.thesstech.com/tryme?filename=nullandundefined

Código de muestra:

function compare(){
    var a = null; //variable assigned null value
    var b;  // undefined
    if (a === b){
        document.write("a and b have same datatype.");
    }
    else{
        document.write("a and b have different datatype.");
    }   
}

0

Si el propósito de la instrucción if es verificar nullo undefinedvalores antes de asignar un valor a una variable, puede hacer uso del Operador de fusión nula , finalmente está disponible en JavaScript, aunque el soporte del navegador es limitado. Según los datos de caniuse , solo el 48.34% de los navegadores son compatibles (a partir de abril de 2020).

const a = some_variable ?? '';

Esto garantizará que la variable se asigne a una cadena vacía (o cualquier otro valor predeterminado) si some_variablees nulloundefined .

Este operador es el más adecuado para su caso de uso, ya que no devuelve el valor predeterminado para otros tipos de valores falsos como 0y ''.


-1

Debe definir una función de esta forma:

validate = function(some_variable){
    return(typeof(some_variable) != 'undefined' && some_variable != null)
}

Eso generará el mismo ReferenceError si la variable no está declarada.
Chad

-1

En ES5 o ES6, si necesita verificarlo varias veces, puede hacerlo:

const excluded = [null, undefined, ''];

if (!exluded.includes(varToCheck) {
  // it will bee not null, not undefined and not void string
}


-1

Con Ramda, simplemente puede hacer que R.isNil(yourValue) Lodash y otras bibliotecas auxiliares tengan la misma función.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.