Los datos expuestos en este blog, son solo de índole informativo. Por favor realiza siempre una copia de seguridad antes de realizar cualquier cambio en tu proyecto.
JavaScript: bucle For
Este tutorial de JavaScript explica cómo usar bucles for con sintaxis y ejemplos.
describir
En JavaScript, un bucle for es una declaración de control básica que le permite repetir el código un número fijo de veces.
sintaxis
La sintaxis de un bucle for en JavaScript es:
for (initialize; test; increment) {
// statements
}parámetro o parámetro
Inicialice la declaración de la variable de contador y asígnele un valor inicial.Por ejemplo, para inicializar una variable llamada contador y establecer su valor en 1, usaría var counter = 1;
prueba La condición que se probará cada vez que se pase el bucle. Si la condición se evalúa como VERDADERO, se ejecuta el cuerpo del ciclo. Si la condición se evalúa como FALSO, termine el ciclo. Por ejemplo, counter < 5;
incremento El valor de incremento para el ciclo. Puede incrementar o decrementar el contador.Por ejemplo, puedes usar counter++ incrementa el contador en 1 o puedes usar counter-- Decrementa el contador en 1. Las sentencias ejecutan las sentencias de código para cada bucle.
notas
- Usas un bucle for cuando quieres ejecutar el cuerpo del bucle un número fijo de veces.
- Consulte también la instrucción break para salir antes de un bucle for.
ejemplo
Veamos un ejemplo que muestra cómo usar bucles for en JavaScript.
Por ejemplo:
for (var counter = 1; counter < 5; counter++) {
console.log(counter + ' - Inside for loop on TechOnTheNet.com');
}
console.log(counter + ' - Done for loop on TechOnTheNet.com');En este ejemplo de bucle for, el bucle continúa mientras el contador sea inferior a 5, de la siguiente manera:
counter < 5;cuando contador < 5 时 for 循环将继续。一旦 counter >= 5, el ciclo terminará.
En este ejemplo, se generará lo siguiente en el registro de la consola del navegador web:
1 - Inside for loop on TechOnTheNet.com 2 - Inside for loop on TechOnTheNet.com 3 - Inside for loop on TechOnTheNet.com 4 - Inside for loop on TechOnTheNet.com 5 - Done for loop on TechOnTheNet.com
Declarar la variable de contador fuera del ciclo for
No necesita declarar su variable de contador en el bucle for. En su lugar, puede reescribir su código de la siguiente manera:
var counter;
for (counter = 1; counter < 5; counter++) {
console.log(counter + ' - Inside for loop on TechOnTheNet.com');
}
console.log(counter + ' - Done for loop on TechOnTheNet.com');En este ejemplo de bucle for, la variable de contador se declara antes de la instrucción de bucle for de la siguiente manera:
var counter;Decrementar la variable del contador en el bucle for
Tradicionalmente, la mayoría de los bucles tienen un contador incremental, pero también puede disminuir el contador. Veamos un ejemplo:
for (var counter = 5; counter > 0; counter--) {
console.log(counter + ' - Inside for loop on TechOnTheNet.com');
}
console.log(counter + ' - Done for loop on TechOnTheNet.com');En este ejemplo de bucle for, la variable de contador se decrementa de la siguiente manera:
counter--En este ejemplo, se generará lo siguiente en el registro de la consola del navegador web:
5 - Inside for loop on TechOnTheNet.com 4 - Inside for loop on TechOnTheNet.com 3 - Inside for loop on TechOnTheNet.com 2 - Inside for loop on TechOnTheNet.com 1 - Inside for loop on TechOnTheNet.com 0 - Done for loop on TechOnTheNet.com
Incrementos más complejos en bucles for
Aunque la mayoría de los bucles se incrementan en 1, puede elegir incrementos distintos de 1. Veamos un ejemplo del uso del incremento 5 en un bucle for:
for (var counter = 0; counter <= 20; counter = counter + 5) {
console.log(counter + ' - Inside for loop on TechOnTheNet.com');
}
console.log(counter + ' - Done for loop on TechOnTheNet.com');En este ejemplo de bucle for, la variable de contador comenzará en 0. Luego, la variable del contador se incrementará en 5 cada vez que pase por el bucle, así:
counter = counter + 5Cuando la variable de contador es mayor que 20, el ciclo for terminará.
En este ejemplo, se generará lo siguiente en el registro de la consola del navegador web:
0 - Inside for loop on TechOnTheNet.com 5 - Inside for loop on TechOnTheNet.com 10 - Inside for loop on TechOnTheNet.com 15 - Inside for loop on TechOnTheNet.com 20 - Inside for loop on TechOnTheNet.com 25 - Done for loop on TechOnTheNet.com