/ JavaScript

Sentencias de bloque y sentencias condicionales en JavaScript

Javascript contiene un conjunto de sentencias muy específicas para el manejo de flujo, las cuales pueden ser usadas para brindar más interactividad en la lógica de tus aplicaciones.

Hablemos de la más básica, la sentencia de bloque.

Básicamente esta se encarga de agrupar las sentencias. El bloque se define con un par de llaves “{ }”, uno que abre y otro que cierra el conjunto de sentencias:

{
	sentencia_1;
	sentencia_2
	.
	.
	.
	sentencia_N;
}

Este: { A + B = C; } es un bloque de sentencias, que contiene una única sentencia.

Nota muy importante: Antes de la versión ECMAScript 6, JavaScript no tenía scope a nivel de bloque. Es decir, las variables que son introducidas en un bloque, pertenecen a ese bloque; ya sea un script o función. Lo que implica que los bloques en sí no introducen un nuevo scope. Los bloques “standalone” son válidos, pero no deberían usarse en JavaScript, pues no se comportan como los bloques en C o Java.

Ejemplo:

var x = 1;
var y = 2;
{
	var x = 2;
	var y = 4;
}
console.log(x); // Imprime 2
console.log(y); // Imprime 4

Sentencias condicionales

Aquí empieza lo bueno de la programación :)

Sin importar el tipo de lenguaje que vayas a aprender, las sentencias condicionales son algo que nunca van a faltar en un código. Por este motivo son pieza fundamental para edificar la lógica de nuestro programa y nos ayuda a dar un resultado dependiendo, si se cumple una condición A o una condición B.

En Javascript, existen dos tipos de sentencias condicionales: if … else y switch

Hablemos de if...else

A través de esta condición podemos ejecutar unas líneas de código si la condición lógica es verdadera o falsa. La sintaxis es la siguiente

if (condicion) {
	sentencia_1;
	sentencia_2;
} else {
sentencia_3;
sentencia_4;
}

Si, la condición lógica: if (condicion) es verdadera, el intérprete de Javascript entenderá que deberá ejecutar las líneas de código: sentencia_1 y sentencia_2.

De lo contrario, si la condición lógica no es verdadera, el intérprete deberá ejecutar las líneas de código sentencia_3 y sentencia_4 que se encuentran a partir del else {

Sin embargo, aún existe una variedad con el uso de la sentencia if...else y tiene que ver con el else if (condicion)

No siempre nuestro código se va a delimitar en responder si se cumple o no una única condición. Hay ciertos momentos en los que debemos evaluar dos o más condiciones lógicas, para que nuestro código arroje el resultado deseado dependiendo de dicha condición.

Entonces else if ( condicion ), existe para evaluar más de una condición dentro de un mismo contexto proporcionando más posibilidades de resultado dependiendo de las condiciones evaluadas por el intérprete del código.

if (condicion_a) {
	sentencia_1;
	sentencia_2;
} else if (condicion_b) {
	sentencia_3;
sentencia_4;
} else {
sentencia_5;
sentencia_6;
}

Nota: Nunca aconsejo usar asignación simple a la hora de evaluar una expresión condicional.

Si deseas hacer una asignación simple dentro de una expresión condicional, recomiendo que la encierres en un par de paréntesis así:

if (( x = 1 )) {
sentencia_1;
sentencia_2;
}

Valores falsos

Ahora bien, sabemos que una sentencia condicional evalúa un valor para ejecutar un script. Teniendo en cuenta esto, les muestro a continuación los siguientes valores que se evaluarán indiscutiblemente como falso.

Si te sientes algo perdido, te recomiendo leer este artículo que realicé sobre estructuras y tipos de datos

  • 0
  • cadena vacía (“”)
  • NaN
  • null
  • undefined
  • false

El resto de tipos de valores serán evaluados como verdaderos en una sentencia condicional.

Nota: Por favor, no confundas el valor primitivo boolean true y false, con el valor del objeto boolean true y false. Para menos enredos y lo explico de nuevo… El valor boolean primitivo es algo muy distinto a un objeto boolean.

Ejemplo de sentencia condicional if...else

// El formato de hora es militar

if ( hora < 12 ) {
console.log(“Buenos días campeón”);
} else if ( hora < 18 ) {
	console.log(“Buenas tardes, ¿Qué tal el almuerzo?”);
} else {
	console.log(“buenas noches”);
}

Sentencia condicional switch

Anteriormente expliqué que con la ayuda de else...if ( condicion ) podríamos evaluar dos o más sentencias condicionales y ejecutar un conjunto de sentencias incluidas dentro del bloque que contiene determinada condición. Ahora bien, existen situaciones en las que debemos evaluar un gran número de sentencias condicionales que, por casos de optimización, ya no sería eficiente hacer uso de else if ( condicion ).

Imagínate cómo sería evaluar 10 sentencias condicionales haciendo uso de else...if

Ejemplo:

if ( condicion_1 ) {
sentencia_1;
sentencia_2;
} else if ( condicion_2 ) {
	sentencia_3;
sentencia_4;
} else if ( condicion_3 ) {
sentencia_5;
sentencia_6;
} else if ( condicion_4 ) {
sentencia_7;
sentencia_8;
} else if ( condicion_5 ) {
sentencia_9;
sentencia_10;
} else if ( condicion_6 ) {
sentencia_11;
sentencia_12;
} else if ( condicion_7 ) {
sentencia_13;
sentencia_14;
} else if ( condicion_8 ) {
sentencia_15;
sentencia_16;
} else if ( condicion_9 ) {
sentencia_17;
sentencia_18;
} else {
sentencia_19;
sentencia_20;
}

Y a pesar de que esta no es una mala práctica, hay situaciones que debemos optimizar nuestro código con miras a, que este sea más legible y fácil de modificar. Por eso existe Switch.

Además Switch nos proporciona una manera un tanto más sofisticada para evaluar una expresión e intentar encajar el valor de dicha expresión en una etiqueta de caso; que en situación tal, de que esta sea verdadera, ejecutará las sentencias de código asociadas a esa etiqueta.

Sintaxis de la sentencia condicional Switch

switch ( expresion ) {
case etiqueta_1:
sentencia_1;
sentencia_2;
break;
	case etiqueta_2:
		sentencia_3;
		sentencia_4;
		break;
	.
	.	
	case etiqueta_n:
		sentencia_n;
		sentencia_n;
		break;
}

Pero… ¿Cómo funciona switch?

  • El programa busca la cláusula case con una etiqueta que coincida con el valor de la expresión
  • Si ambos coinciden, se ejecutan las sentencias asociadas a esa cláusula case específica.
  • Si no se encuentran etiquetas que coincidan, el programa busca la cláusula opcional default y ejecuta las sentencias asociadas a ella.
  • Si no se encuentra la cláusula default, el programa se seguirá ejecutando por la siguiente sentencia hasta llegar al final de switch.

Se entiende, que la última cláusula, es la denominada por defecto de la sentencia condicional. Sin embargo no siempre deberá ser así.

Llegó el momento de hablar de la sentencia Break;

Pero sí, me imagino que te estarás preguntando… Y ¿qué pasa con esa sentencia break; que estoy viendo en el código?

Resulta que esa sentencia, es la responsable de finalizar la sentencia condicional switch una vez y se ejecutan todas las sentencias asociadas a la etiqueta case que la contiene. Es como una puerta de salida una vez el código a logrado su objetivo.

Cuando no escribimos la sentencia break; el código seguirá su ejecución a través de la siguiente etiqueta case y evaluará si cumple con los criterios para ejecutar las sentencias que contiene y así sucesivamente hasta llegar al final de la sentencia condicional switch. Por lo cual, no recomiendo que te olvides de usar la sentencia break;, pues con esto el programa no seguirá leyendo todas las líneas de código que contiene el switch y se saldrá en el momento que le indiquemos para que siga leyendo el código relevante para nuestro programa.

Así lograrás que tu código cumpla los objetivos con el menor uso de recursos de hardware posible. Una primicia que no deberá faltar en tus buenas prácticas de trabajo.

Ejemplo de switch

// Con este ejemplo, deseamos obtener el día actual e imprimirlo en un Console.log
// new Date().getDay() Es el objeto que obtiene el día.

switch (new Date().getDay()) {
    case 0:
        day = "Domingo";
        console.log( "hoy es: " + day );
        break;
    case 1:
        day = "Lunes";
        console.log( "hoy es: " + day );
        break;
    case 2:
        day = "Martes";
        console.log( "hoy es: " + day );
        break;
    case 3:
        day = "Miércoles";
        console.log( "hoy es: " + day );
        break;
    case 4:
        day = "Jueves";
        console.log( "hoy es: " + day );
        break;
    case 5:
        day = "Viernes";
        console.log( "hoy es: " + day );
        break;
    case 6:
        day = "Sábado";
        console.log( "hoy es: " + day );
}
Sentencias de bloque y sentencias condicionales en JavaScript
Share this

Subscribe to Esteban con Gafas