En este punto, probablemente entiendas los conceptos de alto nivel que hay detrás de los bucles, pero probablemente estés pensando "OK, fantástico, pero ¿Cómo me ayuda esto a escribir un mejor código JavaScript?". Como dijimos antes, los bucles tienen que ver con hacer lo mismo una y otra vez, lo cual es bueno para completar rápidamente tareas repetitivas.
Muchas veces, el código será ligeramente diferente en cada iteración sucesiva del bucle, lo que significa que puedes completar una carga completa de tareas que son similares, pero ligeramente diferentes — si tienes muchos cálculos diferentes que hacer, quieres hacer cada uno de ellos, ¡no el mismo una y otra vez!
Vamos a ver un ejemplo para ilustrar perfectamente por qué los bucles son tan útiles. Digamos que queremos dibujar 100 círculos aleatorios en un elemento <canvas> (presiona el botón Update para ejecutar el ejemplo una y otra vez y ver diferentes configuraciones aleatorias):
No tienes que entender todo el código por ahora, pero vamos a echar un vistazo a la parte de código que dibuja los 100 círculos:
.png "carbon(622).png")
Debes quedarte con la idea básica. — utilizamos un bucle para ejecutar 100 iteraciones de este código, cada una de las cuales dibuja un círculo en una posición aleatoria de la página. La cantidad de código necesario sería el mismo si dibujáramos 100, 1000, o 10,000 círculos. Solo necesitamos cambiar un número.
Si no usáramos un bucle aquí, tendríamos que repetir el siguiente código por cada círculo que quisiéramos dibujar:
.png "carbon(623).png")
Esto sería muy aburrido y difícil de mantener de forma rápida. Los bucles son realmente lo mejor.