Una forma común de ejecutar lógica de manera condicional en JavaScript es el condicional if.
Consta de la palabra clave if, una condición entre paréntesis y un bloque de código entre llaves.
El bloque de código solo se ejecutará si la condición se evalúa como true.
if (condition) {
// code that is executed if "condition" is true
}
Se puede usar por sí solo o combinarlo con la palabra clave else.
if (condition) {
// code that is executed if "condition" is true
} else {
// code that is executed otherwise
}
Para anidar otra condición dentro de la sentencia else, puedes usar else if.
Fíjate que no existe la palabra clave elseif en JavaScript.
En su lugar, escribe else seguido de otro condicional if.
if (condition1) {
// code that is executed if "condition1" is true
} else if (condition2) {
// code that is executed if "condition2" is true
// but "condition1" was false
} else {
// code that is executed otherwise
}
En teoría, puedes anidar tantas condiciones adicionales como quieras.
En la práctica, en estos casos usarías una sentencia switch en su lugar.
if (condition1) {
// ...
} else if (condition2) {
// ...
} else if (condition3) {
// ...
} else if (condition4) {
// ...
} else {
// ...
}
Cuando construyas condiciones complejas, consulta la tabla de precedencia de operadores para evitar paréntesis innecesarios.
if (num >= 0 && num < 1) {
// ...
}
// The inner brackets are obsolete because relational operators
// have higher precedence than logical operators.
<!-- prettier-ignore-start -->
if ((num >= 0) && (num < 1)) {
// ...
}
<!-- prettier-ignore-end -->
Además, considera usar variables adicionales para que el código sea más legible.
const isPositive = num >= 0;
const isSmall = num < 1;
if (isPositive && isSmall) {
// ...
}
En JavaScript, la condición no tiene que ser de tipo boolean. Si en un contexto booleano, como el condicional, se proporciona cualquier otro tipo que no sea boolean, JavaScript convierte el valor a boolean de forma implícita. Consulta el concepto de conversión de tipos para saber qué valores son truthy y cuáles son falsy, respectivamente.
const num = 4;
if (num) {
// this code block will be executed because 4 is truthy
}
Si solo quieres ejecutar una sentencia en el bloque de código de un if o un else, en JavaScript puedes omitir las llaves.
if (condition) doSomething();
// or
if (condition)
doSomething();
Esto se usa a veces, por ejemplo, para comprobar una condición de error. En general, no se recomienda, porque es fácil olvidarse de volver a poner las llaves al agregar una segunda sentencia que debería depender de la misma condición.
Al escribir funciones, es un patrón común omitir el bloque else y, en su lugar, usar un return anticipado en el bloque if.
En muchos casos, esto reduce el anidamiento y hace que el código sea más legible y fácil de seguir.
function checkNumber(num) {
let message = '';
if (num === 0) {
message = 'You passed 0, please provide another number.';
} else {
message = 'Thanks for passing such a nice number.';
}
return message;
}
// Can also be written as ...
function checkNumber(num) {
if (num === 0) {
return 'You passed 0, please provide another number.';
}
return 'Thanks for passing such a nice number.';
}