Los lenguajes de programacin son muy tiles para completar rpidamente tareas repetitivas, desde mltiples clculos bsicos hasta casi cualquier otra situacin en la que tenga que completar muchos elementos de trabajo similares. Aqu veremos las estructuras de bucle disponibles en JavaScript que manejan tales necesidades.
DESCARGAR ☆☆☆☆☆ https://www.google.com/url?hl=en&q=https://urloso.com/2yPm1n&source=gmail&ust=1719839819759000&usg=AOvVaw0gtkbe6OuO6KyETAjcKQms
Deberas tener la idea bsica: estamos usando un bucle para ejecutar 100 iteraciones de este cdigo, cada una de las cuales dibuja un crculo en una posicin aleatoria en la pgina. La cantidad de cdigo necesaria sera la misma si estuviramos dibujando 100 crculos, 1000 o 10.000. Solo un nmero tiene que cambiar.
Aqu pasamos una funcin a cats.map(), y map() llama a la funcin una vez por cada elemento de la matriz, pasando el elemento. A continuacin, aade el valor devuelto de cada llamada de funcin a un nuevo arreglo y, finalmente, devuelve el nuevo arreglo. En este caso, la funcin que proporcionamos convierte el elemento en maysculas, por lo que la matriz resultante contiene todos nuestros gatos en maysculas:
Esto se parece mucho a map(), excepto que la funcin que pasamos devuelve un booleano: si devuelve true, entonces el elemento se incluye en el nuevo arreglo. Nuestra funcin prueba que el elemento comienza con la letra "L", por lo que el resultado es una matriz que contiene solo gatos cuyos nombres comienzan con "L":
Tenga en cuenta que map() y filter() se usan a menudo con expresiones de funciones, que aprenderemos en el mdulo Functions. Usando expresiones de funcin podramos reescribir el ejemplo anterior para que sea mucho ms compacto:
En el ejemplo anterior de "crculos de dibujo", no tiene una coleccin de elementos para recorrer: realmente solo desea ejecutar el mismo cdigo 100 veces. En un caso como ese, debes usar el bucle for. Tiene la siguiente sintaxis:
Dentro del bucle, calculamos el cuadrado del valor actual de i, es decir: i * i. Creamos una cadena que expresa el clculo que realizamos y el resultado, y aadimos esta cadena al texto de salida. Tambin aadimos \n, por lo que la siguiente cadena que aadamos comenzar en una nueva lnea. De manera que:
Esto funciona muy bien, y en las primeras versiones de JavaScript, for...of no exista, por lo que esta era la forma estndar de iterar a travs de un arreglo. Sin embargo, ofrece ms posibilidades de introducir errores en tu cdigo. Por ejemplo:
Si desea salir de un bucle antes de que se hayan completado todas las iteraciones, puede usar la instruccin break. Ya vimos esto en el artculo anterior cuando analizamos las sentencias switch: cuando se cumple un caso en una sentencia switch que coincide con la expresin de entrada, la sentencia break sale inmediatamente de la sentencia switch y pasa al cdigo despus de ella.
Digamos que queramos buscar a travs de una serie de contactos y nmeros de telfono y devolver solo el nmero que queramos encontrar. Primero, un HTML simple: un de texto que nos permite ingresar un nombre para buscar, un elemento para enviar una bsqueda y un elemento para mostrar los resultados en:
La instruccin continue funciona de manera similar a break, pero en lugar de salir del bucle por completo, salta a la siguiente iteracin del bucle. Veamos otro ejemplo que toma un nmero como entrada y devuelve solo los nmeros que son cuadrados de enteros (nmeros enteros).
for no es el nico tipo de bucle disponible en JavaScript. En realidad, hay muchos otros y, aunque no es necesario que entiendas todos estos ahora, vale la pena echar un vistazo a la estructura de un par de otros para que puedas reconocer las mismas caractersticas en el trabajo de una manera ligeramente diferente.
Esto funciona de una manera muy similar al bucle for, excepto que la variable inicializadora se establece antes del bucle, y la expresin final se incluye dentro del bucle despus del cdigo a ejecutar, en lugar de que estos dos elementos se incluyan dentro de los parntesis. La condicin se incluye dentro de los parntesis, que estn precedidos por la palabra clave while en lugar de for.
Los mismos tres elementos todava estn presentes, y todava estn definidos en el mismo orden en que estn en el bucle for. Esto se debe a que debe tener un inicializador definido antes de poder verificar si la condicin es verdadera o no. La expresin final se ejecuta despus de que se haya ejecutado el cdigo dentro del bucle (se ha completado una iteracin), lo que solo ocurrir si la condicin sigue siendo cierta.
La principal diferencia entre un bucle do...while y un bucle while es que el cdigo dentro de un bucle do...while siempre se ejecuta al menos una vez. Esto se debe a que la condicin viene despus del cdigo dentro del bucle. As que siempre ejecutamos ese cdigo, luego verificamos si necesitamos ejecutarlo de nuevo. En los bucles while y for, la comprobacin es lo primero, por lo que es posible que el cdigo nunca se ejecute.
Advertencia: Con while y do...while, como con todos los bucles, debe asegurarse de que el inicializador se incremente o, segn el caso, se disminuya, para que la condicin finalmente se vuelva falsa. Si no, el bucle continuar para siempre y el navegador lo obligar a detenerse o se bloquear. Esto se llama un bucle infinito.
Nota: Si comienza a escribir el bucle (por ejemplo, (while(i>=0)), es posible que el navegador se atasque porque an no ha ingresado la condicin final. As que ten cuidado con esto. Puedes empezar a escribir tu cdigo en un comentario para hacer frente a este problema y eliminar el comentario despus de terminar.
En este ejercicio, queremos que tomes una lista de nombres almacenados en un arreglo y los pongas en una lista de invitados. Pero no es tan fcil: no queremos dejar entrar a Phil y Lola porque son codiciosos y groseros, y siempre comen toda la comida! Tenemos dos listas, una para que los huspedes la admitan y otra para que los huspedes la rechacen.
Pregunta de bonificacin adicional: despus de completar las tareas anteriores con xito, te quedarn dos listas de nombres, separadas por comas, pero estarn desordenadas: habr una coma al final de cada una. Puedes averiguar cmo escribir lneas que corten la ltima coma en cada caso y aadir un punto al final? Consulta el artculo Mtodos de cadenas tiles para obtener ayuda.
Si est iterando a travs de un arreglo o algn otro objeto que lo admita, y no necesita acceder a la posicin de ndice de cada elemento, entonces for...of es la mejor opcin. Es ms fcil de leer y hay menos para equivocarse.
Para otros usos, los bucles for, while y do...while son en gran medida intercambiables. Todos se pueden usar para resolver los mismos problemas, y cul uses depender en gran medida de tus preferencias personales: cul te resulta ms fcil de recordar o ms intuitivo. Recomendaramos for, al menos para empezar, ya que es probablemente el ms fcil para recordar todo: el inicializador, la condicin y la expresin final tienen que ir perfectamente entre parntesis, por lo que es fcil ver dnde estn y comprobar que no te los ests perdiendo.
Nota: Tambin hay otros tipos/caractersticas de bucle, que son tiles en situaciones avanzadas/especializadas y ms all del alcance de este artculo. Si quieres ir ms all con tu aprendizaje en bucle, lee nuestra Gua de bucles e iteraciones avanzada.
Has llegado al final de este artculo, pero puedes recordar la informacin ms importante? Puedes encontrar algunas pruebas adicionales para verificar que has conservado esta informacin antes de continuar. Consulta Pon a prueba tus habilidades: bucles.
Este artculo te ha revelado los conceptos bsicos que hay detrs y las diferentes opciones disponibles al hacer bucles de cdigo en JavaScript. Ahora deberas tener claro por qu los bucles son un buen mecanismo para lidiar con el cdigo repetitivo y tener ganas de usarlos en tus propios ejemplos!
\n Deberas tener la idea bsica: estamos usando un bucle para ejecutar 100 iteraciones de este cdigo, cada una de las cuales dibuja un crculo en una posicin aleatoria en la pgina.\n La cantidad de cdigo necesaria sera la misma si estuviramos dibujando 100 crculos, 1000 o 10.000.\n Solo un nmero tiene que cambiar.\n
\n Esto se parece mucho a map(), excepto que la funcin que pasamos devuelve un booleano: si devuelve true, entonces el elemento se incluye en el nuevo arreglo.\n Nuestra funcin prueba que el elemento comienza con la letra \"L\", por lo que el resultado es una matriz que contiene solo gatos cuyos nombres comienzan con \"L\":\n
\n Tenga en cuenta que map() y filter() se usan a menudo con expresiones de funciones, que aprenderemos en el mdulo Functions.\n Usando expresiones de funcin podramos reescribir el ejemplo anterior para que sea mucho ms compacto:\n
\n En el ejemplo anterior de \"crculos de dibujo\", no tiene una coleccin de elementos para recorrer: realmente solo desea ejecutar el mismo cdigo 100 veces.\n En un caso como ese, debes usar el bucle for.\n Tiene la siguiente sintaxis:\n
Dentro del bucle, calculamos el cuadrado del valor actual de i, es decir: i * i. Creamos una cadena que expresa el clculo que realizamos y el resultado, y aadimos esta cadena al texto de salida. Tambin aadimos \\n, por lo que la siguiente cadena que aadamos comenzar en una nueva lnea. De manera que:
\n Esto funciona muy bien, y en las primeras versiones de JavaScript, for...of no exista, por lo que esta era la forma estndar de iterar a travs de un arreglo.\n Sin embargo, ofrece ms posibilidades de introducir errores en tu cdigo. Por ejemplo:\n
d3342ee215