Tutoriales JavaScript | Control de flujo

Curso completo de JavaScript para todos los niveles

//Tutoriales JavaScript | Control de flujo
Tutoriales JavaScript | Control de flujo2019-06-20T10:04:56+00:00

Lección 7. Control de flujo

También conocido como funciones condicionales, son una serie de estructuras que van a determinar el funcionamiento de nuestro programa, si tiene que ir por este sitio en vez de por este otro, si tiene que repetir tantas veces esta instrucción mientras se cumpla cierta condición… etc. Sin estas estructuras, nuestro programa sería una serie de instrucciones que se ejecutarían línea tras línea sin poder tomar decisiones.

Estructura if – if…else

Se utiliza para tomar decisiones en función de un resultado booleano. Esta estructura es la más utilizada en la programación al ser la más básica pero a su vez muy efectiva. Que sea una forma básica de controlar el flujo, no significa que no nos pueda solucionar situaciones complejas. Vamos a ir viendo ejemplos para comprender su funcionamiento tomando como base el ejemplo del formulario utilizado en el apartado de operadores lógicos. En el primer ejemplo vamos a suponer que queremos validar el formulario. Para ello vamos a tener que asegurarnos que los campos obligatorios estén rellenos.

Copy to Clipboard

El resultado que nos va a mostrar el alert en este caso va a ser true. Vamos a ver por qué. En las primeras líneas estamos declarando una serie de variables que simulan los campos de un formulario. Algunas de ellas las utilizamos para guardar datos el usuario y otras para evaluar su contenido. Después estamos declarando una variable booleana que almacenará el resultado en función de si los campos son válidos o no. En el “if” estamos comparando todas las variables que nos dicen si el campo está vacío o no. Como la condición se cumple, entonces se ejecutará las instrucciones que haya dentro del “if”. Vamos a ver otro ejemplo de uso de esta estructura.

Copy to Clipboard

Aquí ya entra en juego el “else”, que básicamente es un “si no”. La lectura en pseudocódigo de esta estructura sería algo como: “Si se cumple esta condición sigue por aquí, si no, sigue por aquí”. El código es muy parecido al del ejemplo anterior, pero en este último en vez de almacenar el resultado de la comparación en una variable lo mostramos directamente en un alert.

Esta estructura de control de flujo nos permite anidarla, esto significa que podemos ejecutar varias condiciones en una misma estructura. Vamos a verlo en un ejemplo y después lo analizamos.

Copy to Clipboard

En este caso cuando ejecutemos esta página, nos va a mostrar un alert informándonos de que el campo “apellidos” no puede estar vacío porque es la única condición que se cumple.

Estructura switch

La estructura switch no es más que un conglomerado de “if” anidados que se muestra de una forma mucho más ordenada y más optimizada, ya que no tiene que ir comprobando una a una todas las condiciones. Esta estructura parte de la evaluación del valor de una variable y en función del valor que tenga ejecutará una parte del switch. Vamos a ver un ejemplo.

Copy to Clipboard

En el ejemplo podemos ver que declaramos una variable opción la cual va a tomar el valor que le demos en el prompt. Después evaluamos su contenido con la estructura switch la cual, en función del valor que tenga “intOpción”, nos va a mostrar un mensaje u otro. Cada caso del switch debe finalizar con un “break;” ya que esto va a indicar a nuestro código que no debe seguir en el switch y no tiene sentido seguir evaluando casos, puesto que ya ha encontrado el que necesitaba. Si no existe ningún caso válido entrará en el “default”, que se ejecutará siempre que no se cumpla ningún caso.

4.8 (95.79%) 19 votes