003. Ciclos o Loops

Los bucles while y do while están cayendo más en desuso ya que el lenguaje se basa en un comportamiento más declarativo que imperativo.

1. Bucle while

Veamos un ejm del bucle while.

Ejm

let contador = 0;

while(contador < 10){
console.log(contador);
contador++;
}

Para que sus iteraciones terminen es necesario agregar un incremento o decremento.

2. do while

Es una variante de while. Su estructura es:

let contador = 0;

do {
console.log(contador);
contador++;
} while (contador < 10)

do while se ejecuta una vez SIEMPRE, la primera vez, ya que la evaluación de la condición está al final.

3 bucle for

Es el bucle o ciclo más usado en Javascript, su sintaxis es la siguiente.

Ejm

for(let i = 1; i < 10; i++){
console.log(contador);
}

Dentro de los paréntesis del for vienen:

  • Inicialización de la variable
  • Condición que se va a evaluar
  • Decremento o incremento

Todo separado por punto y coma (;).

Ejm

let numeros = [10,20,30,40,50,60,70,80,90];
for(let i = 0; i < numeros.length; i++){
console.log(numeros[i]);
}

4. Variantes del bucle for (forin para objetos y forof para arrays)

En Javascript tenemos dos variantes del bucle for, son:

  • forof: permite iterar las propiedades de un array.
  • forin: es un loop que permite recorrer o iterar las propiedades de un objeto.

Ejm forin

const francisco= {
nombre: "Francisco",
apellido: "Paredes",
edade: 35
};

for(const propiedad in francisco){
console.log(propiedad);
}

Permite iterar todas las propiedades de un array. Si quisiéramos imprimir la propiedad y su valor, lo hacemos de la siguiente manera.

const francisco= {
nombre: "Francisco",
apellido: "Paredes",
edad: 51
};

for(let propiedad in francisco){
console.log(`Propiedad: ${propiedad},
valor de la propiedad: ${francisco[propiedad]}`);
}

En este caso, la notación de punto (.) no nos servirá, tenemos que utilizar la notación de los corchetes.

Ejercicio completo forin

Bucle forin Javascript – Ejercicio

El método forof permite recorrer todos los elementos de cualquier elemento que sea iterable en Javascript.

Ejm

const numeros = [10,20,30,40,50];

for(const elemento of numeros){
console.log(elemento);
}

El bucle forof es especialmente útil para array, aunque también lo es para cadena de texto (strings), ya que las cadenas son elementos iterables.

Ejm

let cadena = "Hola Mundo";

for(const elemento of cadena){
console.log(elemento);
}

Ejercicio completo forof

El bucle forof Javascript – Ejercicio