Las sentencias condicionales en JavaScript permiten ejecutar diferentes bloques de código en función de ciertas condiciones. Son fundamentales para controlar el flujo de un programa y tomar decisiones basadas en diferentes criterios.

Conceptos Clave

  1. if: Evalúa una condición y ejecuta un bloque de código si la condición es verdadera.
  2. else: Se utiliza junto con if para ejecutar un bloque de código si la condición del if es falsa.
  3. else if: Permite evaluar múltiples condiciones.
  4. Operadores de comparación: Utilizados para comparar valores en las condiciones (==, ===, !=, !==, >, <, >=, <=).
  5. Operadores lógicos: Permiten combinar múltiples condiciones (&&, ||, !).

Estructura Básica

if

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

if...else

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

if...else if...else

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

Ejemplos Prácticos

Ejemplo 1: Uso Básico de if

let edad = 18;

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

Explicación: Si la variable edad es mayor o igual a 18, se imprime "Eres mayor de edad." en la consola.

Ejemplo 2: if...else

let edad = 16;

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

Explicación: Si la variable edad es menor que 18, se imprime "Eres menor de edad." en la consola.

Ejemplo 3: if...else if...else

let nota = 85;

if (nota >= 90) {
  console.log("Excelente");
} else if (nota >= 75) {
  console.log("Bueno");
} else if (nota >= 50) {
  console.log("Aprobado");
} else {
  console.log("Reprobado");
}

Explicación: Dependiendo del valor de nota, se imprime un mensaje diferente en la consola.

Operadores de Comparación y Lógicos

Tabla de Operadores de Comparación

Operador Descripción Ejemplo
== Igual a 5 == '5'
=== Estrictamente igual a 5 === 5
!= No igual a 5 != '5'
!== Estrictamente no igual a 5 !== '5'
> Mayor que 5 > 3
< Menor que 3 < 5
>= Mayor o igual que 5 >= 5
<= Menor o igual que 3 <= 5

Tabla de Operadores Lógicos

Operador Descripción Ejemplo
&& Y lógico (AND) true && false
` `
! Negación lógica (NOT) !true

Ejercicios Prácticos

Ejercicio 1: Verificación de Edad

Escribe un programa que verifique si una persona es mayor de edad (18 años o más) y muestre un mensaje apropiado.

let edad = 20;

// Tu código aquí

Solución:

let edad = 20;

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

Ejercicio 2: Clasificación de Notas

Escribe un programa que clasifique una nota (0-100) en "Excelente", "Bueno", "Aprobado" o "Reprobado".

let nota = 72;

// Tu código aquí

Solución:

let nota = 72;

if (nota >= 90) {
  console.log("Excelente");
} else if (nota >= 75) {
  console.log("Bueno");
} else if (nota >= 50) {
  console.log("Aprobado");
} else {
  console.log("Reprobado");
}

Errores Comunes y Consejos

  1. Uso incorrecto de == y ===: == compara valores sin tener en cuenta el tipo, mientras que === compara tanto el valor como el tipo. Es recomendable usar === para evitar errores inesperados.

    console.log(5 == '5');  // true
    console.log(5 === '5'); // false
    
  2. Olvidar las llaves {} en bloques de código: Aunque no son necesarias para bloques de una sola línea, es una buena práctica usarlas siempre para evitar errores en el futuro.

    if (edad >= 18)
      console.log("Eres mayor de edad.");
    
  3. No cubrir todos los casos posibles: Asegúrate de manejar todos los casos posibles en tus sentencias condicionales para evitar comportamientos inesperados.

Conclusión

Las sentencias condicionales son una herramienta esencial en JavaScript para controlar el flujo de ejecución de un programa. Con if, else if y else, puedes tomar decisiones basadas en diferentes condiciones. Asegúrate de entender bien los operadores de comparación y lógicos para escribir condiciones precisas y efectivas.

En el próximo tema, exploraremos los bucles en JavaScript, que te permitirán ejecutar bloques de código repetidamente bajo ciertas condiciones.

JavaScript: De Principiante a Avanzado

Módulo 1: Introducción a JavaScript

Módulo 2: Estructuras de Control

Módulo 3: Funciones

Módulo 4: Objetos y Arrays

Módulo 5: Objetos y Funciones Avanzadas

Módulo 6: El Modelo de Objetos del Documento (DOM)

Módulo 7: APIs del Navegador y Temas Avanzados

Módulo 8: Pruebas y Depuración

Módulo 9: Rendimiento y Optimización

Módulo 10: Frameworks y Librerías de JavaScript

Módulo 11: Proyecto Final

© Copyright 2024. Todos los derechos reservados