If-else en JavaScript

En este artículo, aprenderemos cómo utilizar las sentencias if, else y else if en JavaScript para tomar decisiones en función de condiciones específicas. Estas sentencias son fundamentales en la programación y te permitirán controlar el flujo de tu código.

Sentencia if en JavaScript

La sentencia if es la estructura de control básica que nos permite ejecutar un bloque de código si se cumple una condición específica.

Sintaxis básica:


if (condición) {
  // código a ejecutar si la condición es verdadera (true)
}

Lenguaje del código: JavaScript (javascript)

Ejemplo:


let edad = 18;

if (edad >= 18) {
  console.log("Eres mayor de edad.");
}

Lenguaje del código: JavaScript (javascript)

En este ejemplo, si la variable edad es mayor o igual a 18, se ejecutará el bloque de código dentro de las llaves y se imprimirá “Mayor de edad” en la consola.

Sentencia else en JavaScript

La sentencia else se utiliza junto con if para ejecutar un bloque de código en caso de que la condición no se cumpla.

Sintaxis básica:


if (condición) {
  // código a ejecutar si la condición es verdadera (true)
} else {
  // código a ejecutar si la condición es falsa (false)
}

Lenguaje del código: JavaScript (javascript)

Ejemplo:


l<span style="background-color: initial; font-family: inherit; font-size: inherit; white-space: pre-wrap; color: initial;">et edad = 18;</span>

if (edad >= 18) {
  console.log("Eres mayor de edad.");
} else {
  console.log("Eres menor de edad.");
}

Lenguaje del código: JavaScript (javascript)

En este ejemplo, si la variable edad es mayor o igual a 18, se ejecutará el primer bloque de código dentro de las llaves después del if y se imprimirá “Mayor de edad” en la consola.

Si la variable edad es menor a 18, se ejecutará el segundo bloque de código dentro de las llaves después del else y se imprimirá “Menor de edad” en la consola.

Sentencia else if en JavaScript

La sentencia else if nos permite verificar múltiples condiciones en una sola declaración. Se utiliza cuando necesitas comprobar más de una condición y ejecutar diferentes bloques de código según cuál de ellas se cumpla.

Sintaxis básica:


if (condición1) {
  // código a ejecutar si la condición1 es verdadera (true)
} else if (condición2) {
  // código a ejecutar si la condición2 es verdadera (true)
} else {
  // código a ejecutar si ninguna de las condiciones anteriores es verdadera (true)
}

Lenguaje del código: JavaScript (javascript)

Ejemplo:

Aquí hay un ejemplo de código que muestra cómo se puede utilizar la estructura else if en JavaScript:


var edad = 25;

if (edad < 18) {
  console.log("Menor de edad");
} else if (edad >= 18 && edad < 30) {
  console.log("Adulto joven");
} else {
  console.log("Adulto mayor");
}

Lenguaje del código: JavaScript (javascript)

En este ejemplo, primero se evalúa la condición edad < 18. Si esta condición se cumple, se ejecuta el primer bloque de código y se imprime “Menor de edad” en la consola.

Si la condición edad < 18 no se cumple, se evalúa la siguiente condición edad >= 18 && edad < 30. Si esta segunda condición se cumple, se ejecuta el segundo bloque de código y se imprime “Adulto joven” en la consola.

Si ninguna de las condiciones anteriores se cumple, se ejecuta el bloque de código correspondiente a else y se imprime “Adulto mayor” en la consola.

Sentencia if anidadas en JavaScript

Las sentencia if anidadas se refieren a la inclusión de una sentencia if dentro de otra sentencia if. Esto te permite verificar condiciones adicionales si se cumple una condición previa.

Este enfoque puede ser útil cuando necesitas comprobar múltiples condiciones en diferentes niveles.

Sintaxis básica:


if (condición1) {
  // código a ejecutar si la condición1 es verdadera (true)

  if (condición2) {
    // código a ejecutar si la condición1 y la condición2 son verdaderas (true)
  }
}

Lenguaje del código: JavaScript (javascript)

Ejemplo:


let edad = 20;
let licenciaDeConducir = true;

if (edad >= 18) {
  console.log("Eres mayor de edad.");

  if (licenciaDeConducir) {
    console.log("Puedes conducir un vehículo.");
  } else {
    console.log("Necesitas obtener una licencia de conducir.");
  }
} else {
  console.log("Eres menor de edad.");
}

Lenguaje del código: JavaScript (javascript)

En este ejemplo, la primera condición verifica si la persona es mayor de edad (edad >= 18). Si se cumple esta condición, se ejecuta un bloque de código adicional que verifica si la persona tiene una licencia de conducir (licenciaDeConducir). Dependiendo de si la segunda condición es verdadera o falsa, se imprimirá un mensaje diferente en la consola.

Recuerda que anidar muchas sentencias if puede hacer que tu código sea difícil de leer y mantener. Por lo tanto, es recomendable utilizar las sentencias else if o combinar condiciones con operadores lógicos (como &&, || y !) si es posible.

Operador ternario o condicional en JavaScript

El operador ternario, también conocido como operador condicional, es una forma abreviada de utilizar una declaración if-else. Se utiliza cuando quieres asignar un valor a una variable según una condición específica. La sintaxis para el operador ternario es la siguiente:


condición ? expresión_si_verdadero : expresión_si_falso;

Lenguaje del código: JavaScript (javascript)

Si la condición es verdadera, se evalúa y devuelve expresión_si_verdadero; de lo contrario, se evalúa y devuelve expresión_si_falso.

Ejemplo:


let edad = 18;
let mensaje = edad >= 18 ? "Eres mayor de edad." : "Eres menor de edad.";
console.log(mensaje);
Lenguaje del código: JavaScript (javascript)

En este ejemplo, como la variable edad es igual a 18, se cumplirá la condición edad >= 18. Por lo tanto, la variable mensaje tomará el valor de “Eres mayor de edad.” y se mostrará en la consola.

Conclusión

Las sentencias if, else, else if, las if anidadas y el operador ternario son herramientas esenciales en JavaScript y en la programación en general. Permiten controlar el flujo de tu código y ejecutar diferentes bloques de instrucciones en función de condiciones específicas.

Dominar estas sentencias te permitirá crear programas más dinámicos y adaptativos en función de las necesidades de tu proyecto.

Referencias

Aquí tienes algunas referencias útiles para profundizar en las declaraciones condicionales y el operador ternario en JavaScript:

  1. MDN Web Docs – if…else: Este recurso proporciona una descripción detallada de las declaraciones if...else en JavaScript, incluyendo ejemplos y cómo utilizar declaraciones anidadas.
  2. MDN Web Docs – Conditional (ternary) Operator: Este artículo explica cómo utilizar el operador ternario en JavaScript, proporcionando ejemplos y descripciones de sus características.
  3. W3Schools – JavaScript if…else Statement: Aquí encontrarás una descripción general de las declaraciones if…else en JavaScript, con ejemplos y ejercicios interactivos.

Estas referencias te ayudarán a comprender mejor las declaraciones condicionales y el operador ternario en JavaScript, así como a mejorar tus habilidades en la programación de JavaScript. No dudes en consultar estos recursos para obtener información adicional y ejemplos prácticos.

Curso de HTML Desde Cero

Inscríbete Ahora