1.Bucle for
Clásico
Este tipo de bucle se usa cuando conoces la cantidad exacta de iteraciones que deseas realizar.
Sintaxis:
for (inicialización; condición; actualización) {
// Código a ejecutar en cada iteración
}
Ejemplo:
for (let i = 0; i < 5; i++) {
console.log("Iteración número: " + i);
}
Salida:
Iteración número: 0
Iteración número: 1
Iteración número: 2
Iteración número: 3
Iteración número: 4
2. Bucle for...of
Este bucle se utiliza para iterar sobre elementos de objetos iterables, como arreglos, cadenas de texto o Map.
Sintaxis:
for (let elemento of iterable) {
// Código a ejecutar para cada elemento
}
Ejemplo con Arreglo:
const frutas = ["Manzana", "Banana", "Naranja"];
for (let fruta of frutas) {
console.log("Fruta: " + fruta);
}
Salida:
Fruta: Manzana
Fruta: Banana
Fruta: Naranja
3. Bucle for...in
Este bucle se utiliza para recorrer las propiedades enumerables de un objeto (las claves, no los valores).
Sintaxis:
for (let clave in objeto) {
// Código a ejecutar para cada clave
}
Ejemplo con Objeto:
const persona = { nombre: "Juan", edad: 30, ciudad: "Madrid" };
for (let clave in persona) {
console.log(`${clave}: ${persona[clave]}`);
}
Salida:
nombre: Juan
edad: 30
ciudad: Madrid
4. Bucle for
Anidado
Puedes anidar bucles para trabajar con estructuras como matrices bidimensionales.
Ejemplo:
const matriz = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9],
];
for (let i = 0; i < matriz.length; i++) {
for (let j = 0; j < matriz[i].length; j++) {
console.log(`Elemento en [${i}][${j}]: ${matriz[i][j]}`);
}
}
Salida:
Elemento en [0][0]: 1
Elemento en [0][1]: 2
Elemento en [0][2]: 3
Elemento en [1][0]: 4
Elemento en [1][1]: 5
Elemento en [1][2]: 6
Elemento en [2][0]: 7
Elemento en [2][1]: 8
Elemento en [2][2]: 9
5. Bucle for
con break
y continue
break
: Detiene el bucle por completo.continue
: Salta a la siguiente iteración.
Ejemplo con break
:
for (let i = 0; i < 10; i++) {
if (i === 5) {
console.log("Se detiene el bucle en 5.");
break;
}
console.log("Número: " + i);
}
Salida:
Número: 0
Número: 1
Número: 2
Número: 3
Número: 4
Se detiene el bucle en 5.
Ejemplo con continue
:
for (let i = 0; i < 5; i++) {
if (i === 2) {
console.log("Se salta la iteración 2.");
continue;
}
console.log("Número: " + i);
}
Salida:
Número: 0
Número: 1
Se salta la iteración 2.
Número: 3
Número: 4
Diferencias entre for...of
y for...in
for...of
: Trabaja con valores de objetos iterables (arreglos, cadenas).for...in
: Trabaja con claves de objetos.
Ejemplo Comparativo:
const arreglo = ["a", "b", "c"];
console.log("Con for...of:");
for (let valor of arreglo) {
console.log(valor); // a, b, c
}
console.log("Con for...in:");
for (let indice in arreglo) {
console.log(indice); // 0, 1, 2
}
Otros ejemplos
// Contador del 1 al 10
contador=0;
for(contador=1;contador<=10;contador++){
console.log("contador: "+contador)
}
console.log('\n'); // coloca una linea en blanco
//Dice cuales son los numeros pares
for(contador=1;contador<=10;contador++){
if((contador%2)==0)
console.log("El número : "+contador+" es par");
}
console.log('\n'); // coloca una linea en blanco
//For of con arreglos arrays
let animales=['Tigre','Cachicamo','Burro','Jirafa']
for(let animal of animales){
console.log(animal);
}
//console.log('\n'); // coloca una linea en blanco
//For in con arreglo arrays
let user={
id:1,
name:'Pedrito',
age:20,
}
console.log('\n'); // coloca una linea en blanco
for(let prop in user) {
console.log(prop,user[prop]);
}
Resultado
contador: 1
06-for.js:4 contador: 2
06-for.js:4 contador: 3
06-for.js:4 contador: 4
06-for.js:4 contador: 5
06-for.js:4 contador: 6
06-for.js:4 contador: 7
06-for.js:4 contador: 8
06-for.js:4 contador: 9
06-for.js:4 contador: 10
06-for.js:6
06-for.js:10 El número : 2 es par
06-for.js:10 El número : 4 es par
06-for.js:10 El número : 6 es par
06-for.js:10 El número : 8 es par
06-for.js:10 El número : 10 es par
06-for.js:12
06-for.js:16 Tigre
06-for.js:16 Cachicamo
06-for.js:16 Burro
06-for.js:16 Jirafa
06-for.js:25
06-for.js:27 id 1
06-for.js:27 name Pedrito
06-for.js:27 age 20
Conclusión
Los bucles for
en sus distintas variantes permiten iterar sobre estructuras de datos de manera eficiente. La elección del tipo de bucle depende del caso de uso específico:
- Usa
for
clásico para iteraciones con índices. - Usa
for...of
para valores de arreglos. - Usa
for...in
para claves de objetos.