Cómo verificar si un valor no es nulo ni una cadena vacía en JS

83

¿Hay alguna verificación si un valor no es nulo ni una cadena vacía en Javascript? Estoy usando el siguiente:

var data; //get its value from db 
if(data != null && data != '') {
   // do something
}

Pero me pregunto si hay otra solución mejor. Gracias.

ivva
fuente
6
if(data)sería suficiente como dice aquí
CIsForCookies
1
Intenté esto pero en uno de los dos casos no funcionó.
ivva
gracias a todos, intentaré esto. Espero que funcione.
ivva
undefinedes uno de los casos especiales que, según su lógica, debería activarse // do somethingpero no lo hará.
Salman A

Respuestas:

157

Si realmente desea confirmar que una variable no es nula ni una cadena vacía específicamente, debe escribir:

if(data !== null && data !== '') {
   // do something
}

Observe que cambié su código para verificar la igualdad de tipos ( !==| ===).

Sin embargo, si solo desea asegurarse de que un código se ejecutará solo para valores "razonables", entonces puede, como ya han dicho otros, escribir:

if (data) {
  // do something
}

Dado que, en javascript, tanto los valores nulos como las cadenas vacías son iguales a falso (es decir null == false).

La diferencia entre esas 2 partes del código es que, para la primera, cada valor que no sea específicamente nulo o una cadena vacía, ingresará if. Sin embargo, en la segunda, cada valor verdadero-ish entrará en los if: false, 0, null, undefinedy cadenas vacías, no lo haría.

Gershon Papi
fuente
2
0 es un valor razonable en muchos casos
Aequitas
3
es por eso que la palabra razonable está envuelta con comillas :)
Gershon Papi
@Adam Si no es así, puedes dejarlo vacío y usar otro. Eso siempre se invertirá como se esperaba.
The Nate
¡No deberían ser datos! == null || data! == '' en lugar de usar &&?
Imdad
@Imdad el OP pidió verificar si el valor no es nulo Y no es una cadena vacía, así que no.
Gershon Papi
18

Tanto nulluna cadena vacía como una cadena vacía son valores falsos en JS. Por lo tanto,

if (data) { ... }

es completamente suficiente.

Sin embargo, una nota al margen: evitaría tener una variable en mi código que pudiera manifestarse en diferentes tipos. Si los datos eventualmente serán una cadena, entonces inicialmente definiría mi variable con una cadena vacía, para que pueda hacer esto:

if (data !== '') { ... }

sin que el nulo (o cualquier cosa extraña como data = "0") se interponga.

Anna Fohlmeister
fuente
11

En lugar de usar

if(data !== null && data !== ''  && data!==undefined) {

// do something
}

Puede usar el siguiente código simple

if(Boolean(value)){ 
// do something 
}
  • Los valores que son intuitivamente "vacíos", como 0, una cadena vacía, nulo, indefinido y NaN, se vuelven falsos
  • Otros valores se hacen realidad
vipinlalrv
fuente
6

A menudo pruebo el valor de verdad y también los espacios vacíos en la cadena:

if(!(!data || data.trim().length === 0)) {
  // do something here
}

Si tiene una cadena que consta de uno o más espacios vacíos, se evaluará como verdadero.

piloto
fuente
4
if (data?.trim().length > 0) {
   //use data
}

el ?. operador de encadenamiento opcional hará un cortocircuito y regresará undefinedsi los datos son nullish( nullo undefined) lo que se evaluará como falso en la ifexpresión.

Sam Hasler
fuente
Honestamente, no sabía nada sobre este operador. Desafortunadamente, algunos navegadores de Android no lo admiten, ¡pero por lo demás, el soporte es bastante bueno!
brandonmack
2

Tanto el nulo como el vacío se pueden validar de la siguiente manera:

<script>
function getName(){
    var myname = document.getElementById("Name").value;
    if(myname != '' && myname != null){
        alert("My name is "+myname);
    }else{
        alert("Please Enter Your Name");
    }       
}

Bhagawat
fuente
1

pruébalo ----------

function myFun(){
var inputVal=document.getElementById("inputId").value;
if(inputVal){
document.getElementById("result").innerHTML="<span style='color:green'>The value is "+inputVal+'</span>';
}
else{
document.getElementById("result").innerHTML="<span style='color:red'>Something error happen! the input May be empty.</span>";
}
}
<input type="text" id="inputId">
<input type="button" onclick="myFun()" value="View Result">
<h1 id="result"></h1>

beletebelay
fuente
1

Cuando codificamos vacío, en esencia, podría significar cualquiera de los siguientes dadas las circunstancias;

  • 0 como en valor numérico
  • 0.0 como en valor flotante
  • '0' como en el valor de la cadena
  • '0.0' como en valor de cadena
  • nulo como en el valor nulo, según la probabilidad también podría capturar indefinido o no
  • indefinido como en valor indefinido
  • falso como en falso valor de verdad, según la probabilidad 0 también como verdadero, pero ¿qué pasa si queremos capturar falso como es?
  • '' valor de picadura vacío sin espacios en blanco ni tabulación
  • '' cadena con espacio en blanco o tabulación solamente

En una situación de la vida real, como dijo OP, es posible que deseemos probarlos todos o, en ocasiones, es posible que solo deseemos probar un conjunto limitado de condiciones.

Generalmente if(!a){return true;}cumple su propósito la mayor parte del tiempo, sin embargo, no cubrirá un conjunto más amplio de condiciones.

Otro truco que ha hecho su ronda es return (!value || value == undefined || value == "" || value.length == 0);

Pero, ¿y si necesitamos controlar todo el proceso?

No existe una solución simple de latigazo cervical en el núcleo nativo de JavaScript, debe adoptarse. Teniendo en cuenta que abandonamos el soporte para IE11 heredado (para ser honesto, incluso Windows lo ha hecho), la siguiente solución nacida de la frustración funciona en todos los navegadores modernos;

 function empty (a,b=[])
 {if(!Array.isArray(b)) return; 
 var conditions=[null,'0','0.0',false,undefined,''].filter(x => !b.includes(x));
 if(conditions.includes(a)|| (typeof a === 'string' && conditions.includes(a.toString().trim())))
 {return true;};
 return false;};`

La lógica detrás de la solución es función tiene dos parámetros una y b , a es el valor necesitamos comprobar, b es una matriz con las condiciones establecidas que necesitamos para excluir de condiciones predefinidas como se indica anteriormente. El valor predeterminado de b se establece en una matriz vacía [].

La primera ejecución de la función es verificar si b es una matriz o no, si no, salga temprano de la función.

el siguiente paso es calcular la diferencia de la matriz desde [null,'0','0.0',false,undefined,'']y hacia la matriz b. si b es una matriz vacía, las condiciones predefinidas se mantendrán; de lo contrario, eliminará los valores coincidentes.

condiciones = [conjunto predefinido] - [conjunto que se excluirá] la función de filtro hace exactamente lo que la utiliza. Ahora que tenemos condiciones en el conjunto de arreglos, todo lo que tenemos que hacer es verificar si el valor está en el arreglo de condiciones. La función incluye hace exactamente eso, no es necesario que escribas bucles desagradables, deja que el motor JS haga el trabajo pesado.

Entendido si vamos a convertir a en una cadena para comparar, entonces 0 y 0.0 funcionarían bien, sin embargo, Null e Undefined lo harían a través de un error que bloquea todo el script. Necesitamos una solución de caso de borde. Debajo de simple || cubre el caso de borde si no se cumple la primera condición. Ejecutar otra verificación temprana a través de incluir hace que la salida sea anticipada si no se cumple.

if(conditions.includes(a)||  (['string', 'number'].includes(typeof a) && conditions.includes(a.toString().trim())))

La función trim () cubrirá los espacios en blanco más amplios y solo el valor de las pestañas y solo entrará en juego en el escenario del borde.

Patio de recreo

function empty (a,b=[]){
if(!Array.isArray(b)) return;
conditions=[null,'0','0.0',false,undefined,''].filter(x => !b.includes(x));
if(conditions.includes(a)|| 
(['string', 'number'].includes(typeof a) && conditions.includes(a.toString().trim()))){
 return true;
} 
return false;
}

console.log('1 '+empty());
console.log('2 '+empty(''));
console.log('3 '+empty('      '));
console.log('4 '+empty(0));
console.log('5 '+empty('0'));
console.log('6 '+empty(0.0));
console.log('7 '+empty('0.0'));
console.log('8 '+empty(false));
console.log('9 '+empty(null));
console.log('10 '+empty(null,[null]));
console.log('11 dont check 0 as number '+empty(0,['0']));
console.log('12 dont check 0 as string '+empty('0',['0']));
console.log('13 as number for false as value'+empty(false,[false]));

Hagámoslo complejo: ¿qué pasa si nuestro valor para comparar es la matriz en sí misma y puede estar tan profundamente anidada como sea posible? ¿Qué pasa si vamos a comprobar si algún valor en la matriz está vacío? Puede ser un caso de negocio de borde.

function empty (a,b=[]){
    if(!Array.isArray(b)) return;

    conditions=[null,'0','0.0',false,undefined,''].filter(x => !b.includes(x));
    if(Array.isArray(a) && a.length > 0){
    for (i = 0; i < a.length; i++) { if (empty(a[i],b))return true;} 
    } 
    
    if(conditions.includes(a)|| 
    (['string', 'number'].includes(typeof a) && conditions.includes(a.toString().trim()))){
     return true;
    } 
    return false;
    }

console.log('checking for all values '+empty([1,[0]]));
console.log('excluding for 0 from condition '+empty([1,[0]], ['0']));

es una función de caso de uso simple y más amplia que he adoptado en mi marco;

  • Da control sobre cuál es exactamente la definición de vacío en una situación dada.
  • Da control para redefinir las condiciones de vacío
  • Se puede comparar para casi todo, desde cadenas, números, flotantes, verdaderos, nulos, indefinidos y arrays profundos
  • La solución se dibuja teniendo en cuenta la resuabilidad y flexibilidad. Todas las demás respuestas son adecuadas en caso de que se trate de uno o dos casos simples. Sin embargo, siempre hay un caso en el que la definición de cambios vacíos mientras que la codificación de los fragmentos anteriores funciona perfectamente en ese caso.
Syed
fuente
0

Me cansé tanto de verificar cadenas nulas y vacías específicamente, que ahora solo escribo y llamo a una pequeña función para que lo haga por mí.

/**
 * Test if the given value equals null or the empty string.
 * 
 * @param {string} value
**/
const isEmpty = (value) => value === null || value === '';

// Test:
isEmpty('');        // true
isEmpty(null);      // true
isEmpty(1);         // false
isEmpty(0);         // false
isEmpty(undefined); // false
Oriberu
fuente
0

function validateAttrs(arg1, arg2, arg3,arg4){
    var args = Object.values(arguments);
    return (args.filter(x=> x===null || !x)).length<=0
}
console.log(validateAttrs('1',2, 3, 4));
console.log(validateAttrs('1',2, 3, null));
console.log(validateAttrs('1',undefined, 3, 4));
console.log(validateAttrs('1',2, '', 4));
console.log(validateAttrs('1',2, 3, null));

x-rw
fuente