Condicionales y bucles JavaScript

En este tutorial aprenderemos los diferentes condicionales y bucles que podemos usar en JavaScript y ejemplos de uso de cada uno de ellos.

Condicional if

• Formato 1

Si la expresión es verdadera se ejecutan las instrucciones entre llaves. Al terminar sigue ejecutando las instrucciones siguientes.

Si es falsa, no se ejecutan las instrucciones entre llaves y pasa a ejecutar las instrucciones siguientes.

if(condición){
  // Instrucciones que se ejecutan si se cumple la condición.
}
// Instrucciones siguientes.

Ejemplo

var num = 5;
if(num > 0){
 alert("Número positivo");
}
alert("El número es "+num);

• Formato 2

Si la expresión es verdadera se ejecutan las instrucciones entre llaves y si es falsa se ejecutan las que están dentro de las llaves del else. Después se ejecutan las instrucciones siguientes.

if(condición){
  //Instrucciones que se ejecutan si se cumple la condición.
 }
else{
  //Instrucciones que se ejecutan si no se cumple la condición
}
//Instrucciones siguientes.

Ejemplo

var num = 5;
if(num >= 0){
 alert("Número positivo");
}
else{
  alert("Número negativo");
}
alert("El número es "+num);

• Formato 3

Si la primera condición se cumple se ejecutan las instrucciones entre las primeras llaves y si es falsa se comprueba la segunda condición, si la segunda se cumple se ejecutan sus instrucciones. Si ninguna de las dos primeras condiciones se cumple, entonces se ejecutan las instrucciones del else.

if(expresion) { 
  // Instrucciones que se ejecutan si se cumple la primera condición
 } 
else if (expresion2) { 
  // Instrucciones que se ejecutan si la primera condición era falsa y la segunda verdadera 
} 
else { 
  // Instrucciones que se ejecutan si las dos condiciones anteriores eran falsas
}
// Instrucciones siguientes

Ejemplo

var num = 5;
if(num > 0){
 alert("Número positivo");
}
else if(num < 0){
  alert("Número negativo");
}
else{
  alert("Número cero");
}
alert("El número es "+num);

Condicional switch

Permite comparar el valor de una variable con algunos valores conocidos.

• Formato

switch (expresión) {
  case valor1:
    //Instrucciones si expresion es igual a valor1 ;
  break;
  case valor2:
    //Instrucciones si expresion es igual a valor2;
  break;
  default:
    //Instrucciones si expresion no es ninguno de los anteriores;
  break;
}

Ejemplo

var num = 2;
switch (num) { 
  case 1: 
   alert("El número es un 1"); 
  break; 
  case 2: 
    alert("El número es un 2");  
  break; 
  default: 
    alert("El número es cualquiera menos el 1 y el 2"); 
  break;
}

Bucle while

Se evalua la expresión. Si es verdadera, se ejecutan las instrucciones. Al terminar se vuelve a evaluar la expresión. De esta forma se ejecutarán las instrucciones mientras la expresión sea verdadera.

• Formato

while(expresion) { 
  // Instrucciones; 
}

Ejemplo

var cont = 0;
while(cont < 5){
  cont = cont + 1;
}

Bucle do while

Una variación del bucle while. En el do while la instrucción se ejecuta al menos una vez. Se evalua la expresión y mientras sea verdadera vuelve a empezar.

• Formato

do{ 
  // Instrucciones
}while(expresion);

Ejemplo

var num = 0;
do{
  num = num + 1;
}while(num < 5);

Bucle for

Bucle que permite que se ejecuten las instrucciones que se encuentran dentro mientras la expresión sea verdadera.

• Formato

for(valor_inicial; expresion_condicional; incremento_decremento){ 
  // Instrucciones 
}

Ejemplo

var num = 0;
var i = 0;
for(i=0;i<5;i++){
  num = num + 2;
}

Bucle for each

For each se trata de un bucle específico para recorrer las propiedades de un método. Nunca se debe usar para recorrer otros elementos.

// Declaramos una variable Coche
var coche= "";
// Declaramos un objeto con sus propiedades
var objeto = {marca: "Seat", modelo: "León", color: "rojo"};
// Bucle for each que recorre las propiedades del objeto
for each (var propiedad in objeto) {
  coche += "propiedad ";
}
// coche ahora vale "Seat León rojo"