Condicionales en JavaScript

Declaraciones Condicionales.

A menudo cuando se escribe código se deben realizar diferentes acciones para diferentes condiciones. Las “instrucciones condicionales” se usan para realizar las diferentes acciones según una condición.

En JavaScript podemos encontrar las siguientes declaraciones condicionales:

if: se usa para ejecutar un bloque código si la condición es verdadera.
if…else: se usa para ejecutar un bloque de código si la condición es verdadera u otro bloque de código si la condición es falsa.
if…else if…else: se usa para seleccionar uno de los muchos bloques de código a ejecutar.
switch: se usa para seleccionar uno de los varios bloques de código a ejecutar (igual ).

Condicional if.

El condicional if ejecuta un bloque de código sólo si la condición evaluada es verdadera.

 sintaxis:
 if (condición) {
   bloque de código a ejecutar
   si la condición    es verdadera
 }

Ejemplo: Escribir buenos días si la hora es menor a 12.

 1 <!DOCTYPE htlm>
 2 <html>
 3     <head>
 4         <title>Condicionales</title>
 5     </head>
 6     <body>
 7         <h1>Saludar</h1>
 8         <p>Saludar si es antes del medio d&iacute;a!</p>
 9         <script type="text/javascript">
 10             var d = new Date();
 11             var time = d.getHours();
 12             if (time < 12){
 13                 document.write("Buenas d&iacute;as ");
 14                 document.write("son las " + time + " horas");
 15             }
 16         </script>
 17     </body>
 18 </html>

Si no vemos nada no se asusten, ya que el código dentro del “if” solo se ejecuta si es antes de medio día.

Condicional if…else.

El condicional if…else se usa para ejecutar un bloque de código si la condición es verdadera u otro bloque de código si la condición es falsa.

 Sintaxis:
 if(condición){
   bloque de código a ejecutar
   si la condición    es verdadera
 }
 else {
   bloque de código a ejecutar
   si la condición    es falsa
 }

ejemplo: Escribir “buenos días” si la hora es menor a 12 o “Debe ser tarde o noche”, si la hora es mayor a 12.

 1 <!DOCTYPE htlm>
 2 <html>
 3     <head>
 4         <title>Condicionales</title>
 5     </head>
 6     <body>
 7         <h1>Saludar</h1>
 8         <p>Saludar seg&uacute;n la hora!</p>
 9         <script type="text/javascript">
 10             var d = new Date();
 11             var time = d.getHours();
 12             if (time < 12){
 13                 document.write("Buenas d&iacute;as ");
 14                 document.write("son las " + time + " horas");
 15             } else {
 16                 document.write("Debe ser tarde o noche");
 17             }
 18         </script>
 19     </body>
 20 </html>

Condicional if…else if…else.

El condiciona if…else if…else se usa para seleccionar uno de los varios bloques de código a ejecutar.

 Sintaxis:
 if(condición1){
   bloque de código a ejecutar
   si la condición1 es verdadera
 }
 else if(condición2){
   bloque de código a ejecutar
   si la condición2 es verdadera
 }
 else {
   bloque de código a ejecutar
   si condición1 y condición2
   no son verdaderas.
 }

Esta estructura puede tener cuantos “else if” sean necesarios para su evaluación.

Ejemplo: Escribir “buenos días” si la hora es menor a 12 o escribir “Debe ser tarde o noche”, si la hora es mayor a 12 o escribir “es medio día” si la hora es igual a 12.

 1 <!DOCTYPE htlm>
 2 <html>
 3     <head>
 4         <title>Condicionales</title>
 5     </head>
 6     <body>
 7         <h1>Saludar</h1>
 8         <p>Saludar seg&uacute;n la hora!</p>
 9         <script type="text/javascript">
 10             var d = new Date();
 11             var time = d.getHours();
 12             if (time < 12){
 13                 document.write("Buenas d&iacute;as ");
 14                 document.write("son las " + time + " horas");
 15             } else if (time > 12) {
 16                 document.write("Debe ser tarde o noche");
 17             } else {
 18                 document.write("es medio d&iacute;a");
 19             }
 20         </script>
 21     </body>
 22 </html>

Codicional switch.

El condicional switch selecciona uno de muchos bloques de código para ejecutar, según una evaluación o un valor.

Sintaxis:
switch([evaluación | valor]) {
   case 1:
     ejecuta este bloque
     si el valor o la evaluación
     son iguales a 1.
     break;
   case 2:
     ejecuta este bloque
     si el valor o la evaluación
     son iguales a 2.
     break;
   default:
     ejecuta este bloque si no ingresa a ninguno
     de los "case" anteriores.
 }

Ejemplo: Escribir “buenos días” si la hora está en el rango de las 0-11 horas, escribir “buenas tardes” si la hora está en el rango de las 13-17, escribir “buenas noches” si la hora está en el rango de las 18-23 horas o escribir “es medio día” si son las 12.

 1 <!DOCTYPE htlm>
 2 <html>
 3     <head>
 4         <title>Condicionales</title>
 5     </head>
 6     <body>
 7         <h1>Saludar</h1>
 8         <p>Saludar seg&uacute;n la hora!</p>
 9         <script type="text/javascript">
 10             var d = new Date();
 11             switch (time = d.getHours())
 12             {
 13                 case 0:
 14                 case 1:
 15                 case 2:
 16                 case 3:
 17                 case 4:
 18                 case 5:
 19                 case 6:
 20                 case 7:
 21                 case 8:
 22                 case 9:
 23                 case 10:
 24                 case 11:
 25                     document.write("buenos d&iacute;as");
 26                     break;
 27                 case 13:
 28                 case 14:
 29                 case 15:
 30                 case 16:
 31                 case 17:
 32                     document.write("buenas tardes");
 33                     break;
 34                 case 18:
 35                 case 19:
 36                 case 20:
 37                 case 21:
 38                 case 22:
 39                 case 23:
 40                     document.write("buenas noches");
 41                     break;
 42                 default:
 43                     document.write("es medio d&iacute;a");
 44             }
 45         </script>
 46     </body>
 47 </html>

Cómo trabaja switch: primero obtenemos la evaluación (time = d.getHours()), luego el valor devuelto por la evaluación es comparado uno a uno con cada uno de los casos (case) de la estructura switch; Si hay un caso que coincida, se ingresará y se ejecutará su código asociado. Se usa la palabra reservada break para romper la ejecución de switch y prevenir la ejecución del código subyacente.

By: Jolth

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s