JS++ | Declaraciones condicionales

Las declaraciones condicionales de varios tipos juegan un papel central en JS++. En este tutorial, veremos la sintaxis básica y algunos usos comunes de tales declaraciones, y también presentaremos dos tipos de expresiones que se usan a menudo en condicionales: operadores de comparación y operadores lógicos.

Nota: Los condicionales, los operadores de comparación y los operadores lógicos de JS++ funcionan de manera similar a sus contrapartes en lenguajes como JavaScript, Java, C++ y C#.

Comencemos por crear una nueva carpeta, asígnele el nombre «Condicionales». Luego cree un nuevo archivo y asígnele el nombre «Conditionals.jspp». Escribe el siguiente código:

external $;

string colorString;
bool likesRed = true;
if (likesRed) {
    colorString = "red";
}

$("#content").text(colorString);
$("#content").css("color", colorString);

Guarde Conditionals.jspp en su carpeta Conditionals. Luego cree un segundo archivo llamado «Conditionals.html» y escriba lo siguiente:

<!DOCTYPE html>
<title>Conditionals program</title>
<body>

<p id="content"></p>

<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="Conditionals.jspp.js"></script>

</body>
</html>

Guarde Conditionals.html en su carpeta Conditionals. Compile Conditionals.jspp y luego abra Conditionals.html en un navegador. Si todo ha funcionado, su documento debería mostrar «rojo» en una fuente roja.

«si», «si no», y «si no»

Conditionals.jspp muestra la sintaxis de una declaración simple if: la palabra clave ifen sí, seguida de un par de paréntesis que contienen una condición para verificar, seguido de un bloque de código entre llaves que se ejecuta si y solo si la condición es verdadera.

Simple If Diagram

Nota: las llaves alrededor del bloque de código son opcionales si el bloque solo contiene una declaración. Sin embargo, para mantener la coherencia y la legibilidad, se recomienda utilizar siempre llaves.

Aunque iflas declaraciones a menudo se usan solas, también se usan comúnmente junto con elsedeclaraciones. Agreguemos una elsedeclaración a Conditionals.jspp:

external $;
    
string colorString;
bool likesRed = true;

if (likesRed) {
    colorString = "red";
}
else {
    colorString = "blue";
}
    
$("#content").text(colorString);    
$("#content").css("color", colorString);

Compile este código y luego abra Conditionals.html en un navegador. El resultado es el mismo: el documento aún muestra «rojo» en una fuente roja. La razón es que el código en un elsebloque solo se ejecuta si la condición en la ifdeclaración asociada es falsa. Para que el código en su elsebloque se ejecute, cambie el valor de likesReda false: Conditionals.html luego mostrará «azul» en una fuente azul.

Tenga en cuenta que la elsedeclaración no especifica una condición propia; la única condición que se verifica en Conditionals.jspp es likesRed. Simplemente tenemos un bloque de código que se ejecuta si esa condición es verdadera y otro bloque que se ejecuta si es falsa.

If Else Diagram

En algunos casos, sin embargo, queremos que la ejecución de nuestro código dependa de más de una condición. Aquí es donde else iflas declaraciones pueden resultar útiles. Una else ifinstrucción proporciona una condición propia y un bloque de código asociado. El bloque de código se ejecuta si la condición es verdadera y todas las condiciones anteriores (es decir, aquellas asociadas con declaraciones ify anteriores else if) son falsas. Revisemos Conditionals.jspp nuevamente para mostrar el uso de una else ifdeclaración:

external $;

string colorString;
bool likesRed = false;
bool likesBlue = true;

if (likesRed) {
    colorString = "red";
}
else if (likesBlue) {
    colorString = "blue";
}
else {
    colorString = "green";
}

$("#content").text(colorString);
$("#content").css("color", colorString);

else ifAquí se ejecutará el código en el bloque, ya que su likesBluecondición es verdadera mientras que la likesRedcondición especificada por la ifinstrucción anterior es falsa. Sin embargo, si cambiamos el valor de likesBluea false, el código del else ifbloque no se ejecutará, pero sí el código del elsebloque. Juega con los valores de likesRedy likesBluepara ti mismo para ver qué efecto tienen en la ejecución del condicional.

Operadores de comparación

A menudo, cuando usamos condicionales, es porque queremos que la ejecución de nuestro código dependa del resultado de una comparación de algún tipo. Por ejemplo, supongamos que queremos verificar si el valor de una tempInCelsiusvariable es igual a 0, y hacer que se ejecute algún código si lo es. Escribiríamos:

if (tempInCelsius == 0) {
    // Code to be executed goes here
}

Este condicional usa el operador de igualdad “==”. Una comparación de igualdad devuelve verdadero si los valores comparados son iguales y falso en caso contrario.

Nota: el operador de igualdad “==” no es lo mismo que el operador de asignación “=”. ¡Cuidado con esta distinción! Si accidentalmente usa «=» en lugar de «==», introducirá errores en su código que pueden ser difíciles de detectar.

JS++ contiene varios operadores de comparación además de “==”. Para extender el ejemplo de verificación de temperatura, supongamos que no queremos verificar el valor exactotempInCelsius de, sino en qué rango se encuentra. Nuestro código podría verse así:

if (tempInCelsius > 30) {
    // Code to execute if temperature is over 30
}
else if (tempInCelsius >= 15) {
    // Code to execute if temperature is between 15 and 30
}
else {
    // Code to execute if temperature is 14 or below
}

Este ejemplo utiliza el operador mayor que “>”, que devuelve verdadero si el operando izquierdo es mayor que el derecho, y el operador mayor o igual que “>=”, que devuelve verdadero si el operando izquierdo es mayor o igual al operando derecho. Puede ver la gama completa de operadores de comparación aquí:

Operadores de comparación en JS++

Operadores logicos

A veces queremos que el código se ejecute solo si se cumplen varias condiciones. Para lograr esto, una opción sería usar condicionales anidados , como los siguientes:

external $;

string colorString;
bool likesRed = true;
bool likesBlue = true;
    
if (likesRed) {
    if (likesBlue) {
        colorString = "I have a wide taste in colors";
        $("#content").text(colorString);
    }
}

Al colocar el likesBluecondicional dentro del likesRedcondicional de esta manera, nos aseguramos de que el código en el likesBluebloque se ejecutará si y solo si ambas condiciones son verdaderas.

Aunque los condicionales anidados se pueden usar para tales propósitos, tienden a dificultar la lectura del código, particularmente cuando los condicionales involucrados son complejos. Una alternativa es utilizar el operador lógico AND “&&”. Reemplacemos nuestro condicional anidado con:

if (likesRed && likesBlue) {
    colorString = "I have a wide taste in colors";
    $("#content").text(colorString);
}

Una declaración «&&» toma dos operandos, que normalmente serán expresiones booleanas. Suponiendo que lo sean, la declaración devuelve verdadero si ambos operandos son verdaderos y falso en caso contrario. Por lo tanto, el código anterior tiene el mismo efecto que el condicional anidado anterior: el bloque de código se ejecuta si y solo si ambos likesRedy likesBlueson verdaderos. Sin embargo, el condicional «&&» es más fácil de leer que el condicional anidado, por lo que es preferible.

JS++ contiene otros dos operadores lógicos además de «&&»: el operador OR «||» y el operador NOT «!». “||” es un operador binario como “&&”: toma dos operandos. Suponiendo que ambas son expresiones booleanas, la declaración devuelve verdadero si al menos un operando es verdadero y falso en caso contrario. “||” es útil en los casos en los que desea que se ejecute algún código si una condición es verdadera u otra es:

if (likesRed || likesBlue) {
    colorString = "I like at least one color";
    $("#content").text(colorString);
}

“!” difiere de “&&” y “||” en que es un operador unario: toma un solo operando. Devuelve verdadero si el operando es falso y falso si el operando es verdadero. Por ejemplo:

if (!likesRed) {
    colorString = "I do not like red";
    $("#content").text(colorString);
}

Nota: Aunque los operandos regidos por “&&” y “||” normalmente serán expresiones booleanas, no es necesario que lo sean. Para cubrir los casos en los que los operandos no son booleanos, «&&» y «||» se definen con mayor precisión de la siguiente manera: una declaración «&&» devuelve falso si el operando izquierdo es falso; de lo contrario, devuelve el valor del operando derecho. Un “||” declaración devuelve verdadero si el operando de la izquierda es verdadero; de lo contrario, devuelve el valor del operando derecho.

Cambiar declaraciones

A veces necesita que su programa maneje varias posibilidades diferentes y ejecute código diferente en cada una. Aunque podría lograr esto usando un condicional con varias else ifdeclaraciones, a menudo es más simple usar una switchdeclaración. Una switchdeclaración evalúa una expresión y compara su valor con una o más caseexpresiones; si una de estas caseexpresiones proporciona una coincidencia, se ejecuta algún código asociado.

Switch Diagram

Tomemos un ejemplo:

external $;

string favoriteColor;
string colorComment;
favoriteColor = "green";
    
switch (favoriteColor) {
    case "red":
        colorComment = "red is fantastic";
        break;
    case "blue":
        colorComment = "blue is wonderful";
        break;
    case "green":
        colorComment = "green is magical";
        break;
    case "yellow":
        colorComment = "yellow is brilliant";
        break;
    default:
        colorComment = "I have no favorite color";
        break;
}
    
$("#content").text(colorComment);

En este ejemplo, la switchinstrucción compara el valor de la string favoriteColorcon las diversas caseexpresiones enumeradas. Cuando encuentra una coincidencia, ejecuta el código asociado. Dado que el valor de favoriteColores «verde», la declaración de cambio ejecuta el código asociado con ese caso: la string colorCommentse establece en » green is magical«.

¿Cuál es el propósito de las palabras clave breaky default? La breakpalabra clave es muy importante porque es necesaria si desea evitar las llamadas «caídas». Fallthrough ocurre cuando una declaración de cambio ejecuta el código asociado con uno o más casos después del caso coincidente. Por ejemplo, si elimina el breakal final del caso verde, la declaración de cambio pasará a establecerse colorCommenten » yellow is brilliant«. En algunas situaciones raras, es posible que desee fallas de este tipo; si es así, omitiría intencionalmente break. (También se le aconsejaría que agregue un comentario que indique explícitamente que la falla fue la intención). Sin embargo, por lo general, querrá incluirlo breakal final de cada caso.

El código de la defaultcláusula se ejecuta si ninguna de las expresiones de mayúsculas y minúsculas coincide con la expresión original. La defaultcláusula es opcional: si no proporciona una, el programa reanuda la ejecución en la primera declaración después de la declaración de cambio.

Publicación traducida automáticamente

Artículo escrito por CharlesKozenyPelling y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *