Declaración if…else: Tomando Decisiones en JavaScript

En el corazón de cualquier programa dinámico se encuentra la capacidad de tomar decisiones. La estructura de control o declaración if…else es la herramienta fundamental en JavaScript que nos permite ejecutar diferentes bloques de código basándonos en si una condición es verdadera o falsa.

Dominar if...else es el primer paso para crear aplicaciones que respondan de manera inteligente a las entradas del usuario, a los datos y a los diferentes estados del programa.

La Declaración if: El Camino Principal

La declaración if es la forma más básica de lógica condicional. Evalúa una condición y, si el resultado es true (o un valor truthy), ejecuta el bloque de código que contiene.

if (condicion) {
  // Este bloque de código se ejecuta solo si la 'condicion' es verdadera.
}

La condición dada puede ser un valor o una expresión. Normalmente, la condición se evalúa como un valor booleano (true o false). Si la condición se evalúa como true, la declaración if ejecuta el bloque. De lo contrario pasa el control a la siguiente declaración.

Cuando la condición no es estrictamente true o false, JavaScript aplica una conversión implícita utilizando el método Boolean(). A continuación, algunos valores y cómo se evalúan:

if ("JavaScript") {
  console.log("La cadena no está vacía"); // Esto se ejecutará
}

if (0) {
  console.log("Esto nunca se ejecutará"); // 0 se evalúa como false
}

Ejemplo básico: En el siguiente código, si la temperatura es mayor a 20, el mensaje “Hace calor” se imprimirá en la consola.

const temperatura = 25;

if (temperatura > 20) {
  console.log("Hace calor");
}

Bloques {}: Una Buena Práctica Esencial

Aunque JavaScript permite omitir las llaves {} si el bloque if solo contiene una instrucción, es una práctica altamente recomendada usarlas siempre.

Ejemplo sin llaves (poco recomendable):

const isLoggedIn = true;

if (isLoggedIn)
    console.log("Bienvenido!"); // Esta línea está controlada por el if.
    // console.log("Continuando..."); // ¡ERROR! Esta línea se ejecutaría siempre.

Ejemplo con llaves (recomendado):

const isLoggedIn = true;

if (isLoggedIn) {
    console.log("Bienvenido!");
    console.log("Este bloque es claro, seguro y fácil de ampliar.");
}

Usar llaves previene errores y hace que el código sea mucho más legible y mantenible.

La Cláusula else: El Camino Alternativo

¿Qué pasa si la condición del if es falsa? La cláusula else nos proporciona un bloque de código alternativo que se ejecutará en ese caso. Esto permite manejar ambos escenarios en una sola estructura condicional, facilitando la toma de decisiones en el código.

if (condicion) {
  // Se ejecuta si la condición es verdadera.
} else {
  // Se ejecuta si la condición es falsa.
}

Esta estructura te permite controlar el flujo de tu programa de manera más completa, permitiendo que se realicen diferentes acciones en función del resultado de la evaluación de la condición.

Ejemplo: Comprobar si un usuario tiene la edad mínima para registrarse.

const userAge = 16;
const minimumAge = 18;

if (userAge >= minimumAge) {
    console.log("Registro permitido. ¡Bienvenido!");
} else {
    const yearsToWait = minimumAge - userAge;
    console.log(`Registro denegado. Debes esperar ${yearsToWait} años más.`);
}

else if: Añadiendo Múltiples Caminos

Cuando necesitas evaluar más de dos posibles resultados, puedes encadenar múltiples condiciones usando else if. JavaScript evaluará cada condición en orden y ejecutará el primer bloque cuyo if o else if sea verdadero.

if (condicion1) {
  // Se ejecuta si la condicion1 es verdadera.
} else if (condicion2) {
  // Se ejecuta si la condicion1 es falsa Y la condicion2 es verdadera.
} else {
  // Se ejecuta si todas las condiciones anteriores son falsas.
}

Ejemplo: Dar un mensaje según la temperatura.

const temperature = 24; // Grados Celsius

if (temperature < 10) {
    console.log("Hace mucho frío. ¡Abrígate!");
} else if (temperature < 20) {
    console.log("El clima es fresco y agradable.");
} else if (temperature < 30) {
    console.log("Hace calor. Un día perfecto para la playa.");
} else {
    console.log("¡Hace mucho calor! Mantente hidratado.");
}

Una vez que se encuentra una condición verdadera, los else if y else restantes se ignoran.

Declaraciones if Anidadas

Las declaraciones if anidadas en JavaScript son una forma de controlar el flujo de un programa permitiendo que se ejecuten diferentes bloques de código dependiendo de múltiples condiciones.

if (condicion1) {
  // Se ejecuta si 'condicion1' es verdadera
  if (condicion2) {
     // Se ejecuta si 'condicion1' y 'condicion2' son verdaderas
  }
} 

La estructura de if anidados es simplemente una declaración if dentro de otra. Esto permite realizar comprobaciones más complejas y tomar decisiones basadas en múltiples criterios. Por ejemplo:

const age = 21;
const state = 'CA';

if (state == 'CA') {
  if (age >= 16) {
    console.log('Puedes conducir.');
  }
}

El anterior código comienza definiendo dos variables: age y state. La primera declaración if verifica si el valor de state es igual a 'CA'. Si esta condición se cumple se ejecuta el bloque de código dentro de este if. Dentro de este bloque hay otra declaración if que verifica si age es mayor o igual a 16. Si ambas condiciones se cumplen, se imprime el mensaje en consola.

En la práctica, debes evitar el uso de declaraciones if anidados tanto como sea posible. Es preferible combinar condiciones utilizando operadores lógicos, como en el siguiente ejemplo:

const age = 16;
const state = 'CA';

if (state === 'CA' && age >= 16) {
  console.log('Puedes conducir.');
}

Ejemplo con operador lógico AND (&&)

El siguiente ejemplo utiliza un operador lógico AND (&&) como condición en el bloque if:

const age = 16;
const country = 'USA';

if (age >= 16 && country === 'USA') {
  console.log('Puedes obtener una licencia de conducir');
} else {
  console.log('No eres elegible para obtener una licencia de conducir');
}

En el anterior ejemplo, como la edad es 16 y el país es EE. UU., la condición age >= 16 && country === 'USA' devuelve true. Por lo tanto, se ejecuta el bloque if y se imprime el mensaje en la consola.

Ejemplo con operador lógico OR (||)

El operador lógico OR (||) se utiliza para verificar si al menos una de las condiciones es true:

const age = 15;
const hasParentalConsent = true;

if (age >= 18 || hasParentalConsent) {
  console.log('Puedes registrarte');
} else {
  console.log('No puedes registrarte');
}

En el anterior ejemplo, age es 15, pero hasParentalConsent es true. Debido a que una de las condiciones es true, se ejecuta el bloque if y se imprime “Puedes registrarte” en la consola.

Conclusión

La declaración if…else es la herramienta principal para la toma de decisiones en JavaScript. Te permite crear flujos de programa dinámicos que reaccionan a diferentes datos y situaciones.

• Usa if para ejecutar código basado en una única condición.
• Añade else para proporcionar un camino alternativo.
• Encadena con else if para manejar múltiples condiciones secuenciales.
• Recuerda usar siempre llaves {} y preferir operadores lógicos sobre los if anidados para mantener tu código limpio y legible.

Dominar estas estructuras es esencial para pasar de escribir scripts simples a construir aplicaciones complejas y robustas.