Volver a la página principal
jueves 18 julio 2024
12

Cómo hacer un bucle "for" en JavaScript

Sintaxis del bucle "for"

La estructura básica de un bucle "for" en JavaScript es la siguiente:

for (inicialización; condición; incremento) {
    // Código a ejecutar en cada iteración
}

Desglose de la sintaxis

1. Inicialización: Aquí se declara e inicializa la variable que se usará como contador del bucle. Este paso se ejecuta solo una vez al inicio del bucle.

2. Condición: Esta expresión se evalúa antes de cada iteración del bucle. Si es verdadera, el bucle continúa; si es falsa, el bucle se detiene.

3. Incremento: Después de cada iteración, se ejecuta esta expresión para actualizar el contador del bucle.

Ejemplo práctico

Veamos un ejemplo simple donde usamos un bucle "for" para imprimir los números del 1 al 5 en la consola:

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

Explicación del ejemplo

  • Inicialización: let i = 1; - Se declara la variable i y se inicializa en 1.
  • Condición: i <= 5; - Mientras i sea menor o igual a 5, el bucle continuará.
  • Incremento: i++ - Después de cada iteración, i se incrementa en 1.

Durante cada iteración, el valor de i se imprime en la consola. Cuando i es mayor que 5, el bucle se detiene.

Usos comunes del bucle "for"

Recorrer un array

Uno de los usos más comunes del bucle "for" es recorrer los elementos de un array:

const frutas = ["manzana", "plátano", "cereza"];
for (let i = 0; i < frutas.length; i++) {
    console.log(frutas[i]);
}

Generar una secuencia de números

Otro uso frecuente es generar una secuencia de números:

for (let i = 0; i < 10; i++) {
    console.log(i * 2);
}

Conclusión

El bucle "for" en JavaScript es una herramienta poderosa y flexible que te permite ejecutar un bloque de código repetidamente, bajo ciertas condiciones. Comprender su sintaxis y sus aplicaciones te ayudará a escribir código más eficiente y efectivo.

Para obtener más información sobre el bucle "for" y otros conceptos de JavaScript, puedes visitar la documentación oficial de MDN.

Compartir:
Creado por:
Author photo

Jorge García

Fullstack developer