A veces, necesitamos realizar diferentes acciones en función de diferentes condiciones.
Para hacer eso, podemos usar la declaración if y el operador condicional ? , también se denomina operador de "signo de interrogación".
La declaración if(...) evalúa una condición entre paréntesis y, si el resultado es true , ejecuta un bloque de código.
Por ejemplo:
let año = Prompt('¿En qué año se publicó la especificación ECMAScript-2015?', '');
if (año == 2015) alerta('¡Tienes razón!'); En el ejemplo anterior, la condición es una simple verificación de igualdad ( year == 2015 ), pero puede ser mucho más compleja.
Si queremos ejecutar más de una declaración, tenemos que encerrar nuestro bloque de código entre llaves:
si (año == 2015) {
alerta("¡Eso es correcto!");
alerta ("¡Eres tan inteligente!");
} Recomendamos envolver su bloque de código con llaves {} cada vez que use una declaración if , incluso si solo hay una declaración para ejecutar. Hacerlo mejora la legibilidad.
La declaración if (…) evalúa la expresión entre paréntesis y convierte el resultado a booleano.
Recordemos las reglas de conversión del capítulo Conversiones de tipos:
Un número 0 , una cadena vacía "" , null , undefined y NaN se vuelven false . Por eso se les llama valores “falsos”.
Otros valores se vuelven true , por eso se les llama “verdad”.
Entonces, el código bajo esta condición nunca se ejecutaría:
if (0) { // 0 es falso
...
}…y dentro de esta condición – siempre será:
if (1) { // 1 es verdadero
...
} También podemos pasar un valor booleano previamente evaluado a if , así:
let cond = (año == 2015); // la igualdad se evalúa como verdadera o falsa
si (cont.) {
...
} La declaración if puede contener un bloque else opcional. Se ejecuta cuando la condición es falsa.
Por ejemplo:
let año = Prompt('¿En qué año se publicó la especificación ECMAScript-2015?', '');
si (año == 2015) {
alert('¡Lo has adivinado bien!');
} demás {
alert('¿Cómo puedes estar tan equivocado?' ); // cualquier valor excepto 2015
} A veces nos gustaría probar varias variantes de una enfermedad. La cláusula else if nos permite hacer eso.
Por ejemplo:
let año = Prompt('¿En qué año se publicó la especificación ECMAScript-2015?', '');
si (año < 2015) {
alerta('Demasiado pronto...');
} más si (año > 2015) {
alerta('Demasiado tarde');
} demás {
alerta ('¡Exactamente!');
} En el código anterior, JavaScript primero verifica year < 2015 . Si eso es falso, pasa a la siguiente condición year > 2015 . Si eso también es falso, muestra la última alert .
Puede haber más else if se bloquea. El último else es opcional.
A veces, necesitamos asignar una variable dependiendo de una condición.
Por ejemplo:
dejar accesoPermitido;
let age = Prompt('¿Cuántos años tienes?', '');
si (edad > 18) {
accesoPermitido = verdadero;
} demás {
accesoPermitido = falso;
}
alerta(accesoPermitido);El llamado operador “condicional” o “signo de interrogación” nos permite hacerlo de una manera más breve y sencilla.
¿El operador está representado por un signo de interrogación ? . A veces se le llama "ternario", porque el operador tiene tres operandos. En realidad, es el único operador en JavaScript que tiene tantos.
La sintaxis es:
dejar resultado = condición? valor1: valor2;
La condition se evalúa: si es verdadera, se devuelve value1 ; en caso contrario, value2 .
Por ejemplo:
let accessAllowed = (edad > 18)? verdadero: falso;
Técnicamente, podemos omitir los paréntesis alrededor de age > 18 . El operador del signo de interrogación tiene una prioridad baja, por lo que se ejecuta después de la comparación > .
Este ejemplo hará lo mismo que el anterior:
// el operador de comparación "edad > 18" se ejecuta primero de todos modos // (no es necesario encerrarlo entre paréntesis) let accessAllowed = edad > 18? verdadero: falso;
Pero los paréntesis hacen que el código sea más legible, por lo que recomendamos usarlos.
Tenga en cuenta:
En el ejemplo anterior, puede evitar el uso del operador de signo de interrogación porque la comparación en sí devuelve true/false :
// lo mismo let accessAllowed = edad > 18;
¿Una secuencia de operadores de signos de interrogación ? puede devolver un valor que depende de más de una condición.
Por ejemplo:
let edad = rápido('¿edad?', 18);
dejar mensaje = (edad <3)? '¡Hola bebé!' :
(edad < 18)? '¡Hola!' :
(edad < 100)? '¡Saludos!' :
'¡Qué edad tan inusual!';
alerta (mensaje);Al principio puede resultar difícil comprender lo que está pasando. Pero después de una mirada más cercana, podemos ver que es solo una secuencia ordinaria de pruebas:
El primer signo de interrogación comprueba si age < 3 .
Si es verdadero, devuelve 'Hi, baby!' . De lo contrario, continúa con la expresión después de los dos puntos “:”, marcando age < 18 .
Si eso es cierto, devuelve 'Hello!' . De lo contrario, continúa con la expresión después de los siguientes dos puntos “:”, comprobando age < 100 .
Si eso es cierto, devolverá 'Greetings!' . De lo contrario, continúa con la expresión después de los últimos dos puntos “:”, y devuelve 'What an unusual age!' .
Así es como se ve esto usando if..else :
si (edad < 3) {
mensaje = '¡Hola, bebé!';
} más si (edad < 18) {
mensaje = '¡Hola!';
} más si (edad < 100) {
mensaje = '¡Saludos!';
} demás {
mensaje = '¡Qué edad tan inusual!';
} ¿A veces el signo de interrogación ? se utiliza como reemplazo de if :
let company = Prompt('¿Qué empresa creó JavaScript?', '');
(empresa == 'Netscape')?
alerta('¡Correcto!'): alerta('Incorrecto'); Dependiendo de la condición company == 'Netscape' , ¿la primera o la segunda expresión después de ? se ejecuta y muestra una alerta.
Aquí no asignamos un resultado a una variable. En cambio, ejecutamos código diferente según la condición.
No se recomienda utilizar el operador del signo de interrogación de esta manera.
La notación es más corta que la declaración if equivalente, lo que atrae a algunos programadores. Pero es menos legible.
Aquí está el mismo código usando if para comparar:
let company = Prompt('¿Qué empresa creó JavaScript?', '');
si (empresa == 'Netscape') {
alerta('¡Correcto!');
} demás {
alerta('Incorrecto');
}Nuestros ojos escanean el código verticalmente. Los bloques de código que abarcan varias líneas son más fáciles de entender que un conjunto de instrucciones largo y horizontal.
¿El propósito del operador del signo de interrogación ? es devolver un valor u otro dependiendo de su condición. Úselo exactamente para eso. Úselo if necesita ejecutar diferentes ramas de código.
importancia: 5
¿Se mostrará alert ?
si ("0") {
alerta('Hola');
}
Sí, lo será.
Cualquier cadena excepto una vacía (y "0" no está vacía) se vuelve true en el contexto lógico.
Podemos ejecutar y comprobar:
si ("0") {
alerta('Hola');
}importancia: 2
Usando la construcción if..else , escriba el código que pregunta: '¿Cuál es el nombre “oficial” de JavaScript?'
Si el visitante ingresa “ECMAScript”, entonces envíe “¡Correcto!”; de lo contrario, envíe: “¿No lo sabes? ¡ECMAScript!”
Demostración en nueva ventana
<!DOCTYPE html>
<html>
<cuerpo>
<guión>
'uso estricto';
let value = Prompt('¿Cuál es el nombre "oficial" de JavaScript?', '');
si (valor == 'ECMAScript') {
alerta('¡Correcto!');
} demás {
alert("¿No lo sabes? ¡ECMAScript!");
}
</script>
</cuerpo>
</html>importancia: 2
Usando if..else , escriba el código que obtiene un número mediante prompt y luego se muestra en alert :
1 , si el valor es mayor que cero,
-1 , si es menor que cero,
0 , si es igual a cero.
En esta tarea asumimos que la entrada es siempre un número.
Demostración en nueva ventana
let valor = solicitud('Escriba un número', 0);
si (valor > 0) {
alerta( 1 );
} más si (valor < 0) {
alerta (-1);
} demás {
alerta (0);
}importancia: 5
Vuelva a escribir esto if utiliza el operador condicional '?' :
dejar resultado;
si (a + b < 4) {
resultado = 'Abajo';
} demás {
resultado = 'Terminado';
}
sea resultado = (a + b < 4)? 'Abajo': 'Arriba';
importancia: 5
Reescribe if..else usando múltiples operadores ternarios '?' .
Para facilitar la lectura, se recomienda dividir el código en varias líneas.
dejar mensaje;
if (iniciar sesión == 'Empleado') {
mensaje = 'Hola';
} else if (iniciar sesión == 'Director') {
mensaje = 'Saludos';
} si no (iniciar sesión == '') {
mensaje = 'Sin iniciar sesión';
} demás {
mensaje = '';
}
let mensaje = (iniciar sesión == 'Empleado')? 'Hola' : (iniciar sesión == 'Director')? 'Saludos' : (iniciar sesión == '')? 'Sin iniciar sesión': '';