Javascript, parte 3: Condicionales

En programación un condicional es una instrucción que le indicará a nuestro programa si debe ejecutarse un bloque de código o bien hacer otra cosa.

Para eso debemos usar la palabra reservada if:

if(condicion){
    //Lo que pasa si se cumple la condición.
}else{
    //Lo que pasa si NO se cumple la condición.
}

(Usamos doble barra // para dejar comentarios en nuestro código. Código que el intérprete va a ignorar)

Lo que hace un condicional es verificar si la condición es verdadera, es decir devuelve true.

let is_mayor_edad = true;
if(is_mayor_edad){
    //Entra por el lado verdadero.
    alert('Usted puede ver la película');
}else{
    //Entra por el lado falso.
    alert('Usted no puede ver la película');
}

Podemos probar esto cambiando la variable is_mayor_edad a false y verificar que entra por el lado falso.

Para hacer una prueba de usuario vamos a usar el método de Javascript confirm() el cual nos mostrará por pantalla un cartel con dos opciones: aceptar y cancelar. Si el usuario presiona aceptar se guardará un valor verdadero y de presionar cancelar será falso:

let is_mayor_edad = confirm('Por favor indique si es mayor de edad')
if(is_mayor_edad){
    //Entra por el lado verdadero.
    alert('Usted puede ver la película');
}else{
    //Entra por el lado falso.
    alert('Usted no puede ver la película');
}

Igualdad

Podemos verificar una condiciona comparando si dos valores son iguales, ya sea una cadena de texto o un número, a través del doble signo igual == Por ejemplo:

let nombre1 = prompt("Indique su nombre");
let nombre2 = prompt("Indique su nombre nuevamente para verificar que esté bien escrito");
if(nombre1 == nombre2){
    alert("Gracias por registrarse: " + nombre1);
}else{
    alert("Los valores ingresados no son iguales");
}

Cuidado, no confundir el signo =, que como ya vimos es usado para asignar el valor de una variable:

let nombre1 = prompt("Indique su nombre");

A difrencia del doble igual que lo que hacer es evaluar que dos valores sean iguales:

if(nombre1 == nombre2)

Este último es un error que muchas veces cometemos por distracción.

Comparación

Si por ejemplo queremos verificar si un número es menor, mayor, menor igual o mayor igual que otro, debemos usar los signos <, >, <=, >= respectivamente.

Por ejemplo:

let numero = prompt("Ingrese un número positivo");
numero = parseInt(numero, 10);
if(numero > 0){
    alert("Gracias");
}else{
    alert("El número debe ser mayor a cero");
}

O bien:

let saldo = prompt("Ingrese su saldo");
saldo = parseFloat(saldo);
let compra = prompt("Ingrese el valor de la compra");
compra = parseFloat(compra);
if(saldo >= compra){
    alert("Usted puede realizar esta compra");
}else{
    alert("Saldo insuficiente");
}

else if

En ciertas ocasiones, podemos evaluar más de una condición. Por ejemplo: si quisiéramos verificar que un número es positivo (numero > 0) o negativo (numero < 0):

let numero = prompt("Ingrese un número");
numero = parseInt(numero, 10);
if(numero > 0){
    alert("El número es positivo");
}else if(numero < 0){
    alert("El número es negativo");
}else{
    //Por descarte el número es cero.
    alert("El número es cero");
}

Condicionales anidados

Javascript también nos da la posibilidad de evaluar condiciones anidadas, es decir condiciones dentro de otras.

En el ejemplo anterior asumíamos que si la condición salía por el lado false (es decir que no era ni positivo ni negativo, era cero)

Pero ¿qué pasa si lo que ingresa el usuario no es un número?

isNaN

El método isNaN nos devolverá un valor verdadero si el valor de una variable o constante NO es un número:

let numero = prompt("Ingrese un número");
numero = parseInt(numero, 10);
if(isNaN(numero)){
    alert("Usted NO ha ingresado un número");
}else{
    if(numero > 0){
        alert("El número es positivo");
    }else if(numero < 0){
        alert("El número es negativo");
    }else{
        //Por descarte el número es cero.
        alert("El número es cero");
    }
}

Operador NOT

Los condicionales se usan para saber si un valor es verdadero. Pero qué pasa si queremos preguntar al revés, es decir, si la condición no se cumple.

En el ejemplo anterior:

let is_mayor_edad = confirm('Por favor indique si es mayor de edad')
if(is_mayor_edad){
    //Entra por el lado verdadero.
    alert('Usted puede ver la película');
}else{
    //Entra por el lado falso.
    alert('Usted no puede ver la película');
}

Verificábamos si lo que haya ingresado el usuario sea verdadero, ésa era la condición, es decir que el usuario sea mayor de edad.

Si quisiéramos mostrar un cartel de advertencia al usuario, solamente si éste no es mayor de edad deberíamos hacer algo como esto:

let is_mayor_edad = confirm('Por favor indique si es mayor de edad')
if(!is_mayor_edad){
    //Entrará acá si el valor es false.
    alert('Usted no puede ver la película');
}

El signo ! se usa como negación.

Otro ejemplo es si quisiéramos comparar dos valores:

let nombre1 = prompt("Indique su nombre");
let nombre2 = prompt("Indique su nombre nuevamente para verificar que esté bien escrito");
if(nombre1 != nombre2){
    alert("Los valores ingresados no son iguales");
}

Es decir que en lugar de evaluar que la condición se cumpa (nombre1 == nombre2) evaluamos que NO sean iguales (nombre1 != nombre2)

Operador AND

Podemos dividir una condición en dos o más, cada una separada por el doble caracter &&:

let numero = prompt("Ingrese un número entre cero y cien.");
numero = parseInt(numero, 10);
if(numero > 0 && numero < 100){
    alert("Gracias");
}else{
    alert("El número está fuera de rango");
}

En el ejemplo anterior ambas condiciones deben cumplirse para entrar en el lado verdadero. Es decir que el número debe ser mayor a cero y menor a cien.

En síntesis, para que una condición con el operador AND (&&) sea verdadera, TODAS sus sub condiciones deben serlo también.

Condición 1Condición 2Resultado
VERDADEROVERDADEROVERDADERO
VERDADEROFALSOFALSO
FALSOVERDADEROFALSO
FALSOFALSOFALSO

Operador OR

Funciona similar a un AND, es decir que podemos dividir una condición en sub condiciones, pero para que se cumpla, al menos una tiene que dar un resultado verdadero. Para esto debemos separar las condiciones con el doble caracter ||:

let medio_pago = prompt("Ingrese el medio de pago: efectivo o tarjeta");
if(medio_pago == "efectivo" || medio_pago == "tarjeta"){
    alert("Gracias.");
}else{
    alert("El medio de pago ingresado no está permitido.");
}
Condición 1Condición 2Resultado
VERDADEROVERDADEROVERDADERO
VERDADEROFALSOVERDADERO
FALSOVERDADEROVERDADERO
FALSOFALSOFALSO