Introducción a JavaScript

1

Fundamentos de JavaScript para Principiantes

2

Instalación y Configuración de JavaScript en Visual Studio Code

3

Instalación y configuración de Visual Studio Code y Node.js en Windows

4

Variables y Buenas Prácticas en JavaScript

5

Tipos de Datos en JavaScript: Primitivos y Complejos

6

Manipulación de Strings en JavaScript: Escritura, Concatenación y Substrings

7

Números y Operaciones Matemáticas en JavaScript

8

Conversión de Tipos en JavaScript: Implícita y Explícita

9

Conversión de Tipos en JavaScript: Explícita e Implícita

Estructuras de Control y Lógica

10

Operadores de Comparación en JavaScript: Igualdad y Desigualdad

11

Operadores Lógicos en Programación: AND, OR y NOT

12

Estructuras Condicionales: Uso de IF, ELSE y ELSE IF en JavaScript

13

Juego de Adivinanza: Programación con Estructuras Condicionales

14

Estructura y uso del condicional Switch en programación

15

Ciclo For: Iteración de Listas y Uso de Console.log en JavaScript

16

Iteración con for-of en JavaScript para arrays y strings

17

Iteración sobre Objetos con forIn en JavaScript

18

Uso del ciclo while para iteración en programación

19

Ciclos doWhile: Estructura y Diferencias con While

Funciones y This

20

Funciones en JavaScript: Cómo Calcular Precios con Descuentos

21

Diferencias entre Funciones y Métodos en JavaScript

22

Funciones Puras e Impuras en Programación: Conceptos y Ejemplos

23

Arrow Functions y Enlace Léxico en JavaScript

24

Scope y Contextos de Ejecución en JavaScript

25

Closures y Ámbito Léxico en JavaScript

26

Fundamentos del Desarrollo Web: Frontend y Backend

Manipulación de Arrays

27

Arrays: Propiedades, Acceso y Creación en Programación

28

Mutabilidad e inmutabilidad en arrays: conceptos y ejemplos prácticos

29

Métodos push y pop para modificar arrays en JavaScript

30

Métodos map y forEach en JavaScript: Uso y Ejemplos Prácticos

31

Métodos Filter y Reduce en JavaScript: Uso y Ejemplos Prácticos

32

Métodos find y findIndex en JavaScript: Uso y ejemplos prácticos

33

Uso del método slice para extraer porciones de un array en JavaScript

34

Uso del Spread Operator en JavaScript: Copia, Combinación y Más

Programación Orientada a Objetos

35

Programación Orientada a Objetos en JavaScript: Conceptos y Práctica

36

Creación y Manipulación de Objetos en JavaScript

37

Función constructora y gestión de instancias en JavaScript

38

Clases en JavaScript: Creación y Uso de Objetos con Sintaxis Moderna

39

Programación Orientada a Objetos en JavaScript: Clases y Prototipos

40

Prototipos y Herencia en JavaScript: Construcción y Uso Práctico

41

Métodos y herencia prototípica en JavaScript

42

Uso de "this" en Clases y Funciones Constructoras

43

Validación de Usuarios en una Red Social: Algoritmo Básico

44

Implementación de la Función Sign-In y Validación de Usuario

Asincronía en JavaScript

45

Programación Síncrona y Asíncrona en JavaScript

46

Promesas en JavaScript: Asincronía y Manejo de Estados

47

Uso de Async/Await para Promesas Asíncronas en JavaScript

48

Peticiones asíncronas con for await en JavaScript

49

Fundamentos de HTTP: Cliente-Servidor y Métodos de Petición

50

Peticiones HTTP en Frontend: Uso de Fetch y Análisis en Network

51

Peticiones HTTP en JavaScript: Fetch, GET, POST y DELETE

52

Envío de Datos al Servidor con JavaScript y Fetch API

53

Eliminar Posts con JavaScript y Delegación de Eventos

54

Manejo de IDs en JavaScript para eliminar artículos del DOM

55

Actualizaciones y Nuevas Funciones en JavaScript

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Uso del ciclo while para iteración en programación

18/55
Recursos

¿Qué es el método while en programación?

El método while es una estructura de control de flujo utilizada en programación para repetir un bloque de código mientras una condición específica sea verdadera. Esta técnica permite realizar iteraciones eficientes, ejecutando una secuencia de instrucciones repetidamente hasta que la condición evaluada deje de cumplirse.

¿Cómo funciona la estructura de un ciclo while?

La estructura de un ciclo while en programación implica utilizar la palabra clave reservada while, seguida de una condición. Este ciclo continuará ejecutando el código contenido en su bloque interno hasta que dicha condición se torne falsa. La estructura básica es sencilla, pero su implementación debe manejarse con precaución para evitar conflictos como los 'loops' infinitos.

Estructura básica de un ciclo while:

while (condición) {
    // Código a ejecutar mientras la condición sea verdadera
}

¿Cómo podemos evitar los loops infinitos?

Los loops infinitos ocurren cuando la condición en un ciclo while nunca se vuelve falsa, permitiendo que el ciclo continúe indefinidamente. Esto puede llevar al consumo excesivo de recursos del sistema y, por ende, a inestabilidades en las aplicaciones. Para evitarlo:

  • Control y actualización de la condición: Asegúrate de modificar las variables involucradas en la condición dentro del bloque del ciclo. Esto garantiza que eventualmente el ciclo pueda salir.

  • Ejemplo con un contador:

let contador = 0;

while (contador < 10) {
    console.log(contador);
    contador++; // Incremento que evita el loop infinito
}

¿Qué implica el procesamiento de un ciclo while en el navegador?

Implementar un ciclo while en las aplicaciones front-end, como las que corren en el navegador, requiere cuidado. Un loop infinito podría consumir toda la memoria RAM disponible, afectando severamente el rendimiento de las pestañas abiertas o incluso el navegador completo. Por ello, es esencial:

  • Mantener condiciones claras y alcanzables.
  • Monitorear el rendimiento: Usa herramientas de desarrollo para observar el uso de memoria y CPU.
  • Vigilar comportamientos anómalos tras introducir un nuevo while.

¿Cómo puedo optimizar mis ciclos while?

Para escribir ciclos while eficientes:

  1. Define claramente las condiciones de entrada y salida.
  2. Realiza pruebas exhaustivas con diferentes escenarios de valores.
  3. Utiliza incrementos o decrementos que acerquen tu variable a la cumplirse la condición.
  4. Documenta y revisa el código con herramientas de análisis estático si es posible.

Finalmente, recuerda que conocer el propósito de tus iteraciones y planificar el flujo de control adecuadamente será clave para aprovechar al máximo este método, garantizando el correcto funcionamiento de tus aplicaciones. ¡Sigue explorando y aprendiendo para perfeccionar tus habilidades de programación!

Aportes 15

Preguntas 0

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

## Resumen de la clase! El loop `while` ejecuta repetidamente el código mientras la condición que le indiquemos se cumpla (es decir, que la condición corresponda a `true`) 🚧 Es por esto que hay que tener mucho cuidado en la definición de nuestra condición, de lo contrario tendremos un loop infinito! ❗ Podemos usar la sentencia `continue` para saltar a la siguiente iteración de nuestro ciclo `while` > 💡 [Aquí puedes leer la documentación de este ciclo](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)
Apliqué en este ejercicio que hice, los dos últimos conceptos que vimos: For y While![](https://static.platzi.com/media/user_upload/for-while-0d261858-1e6a-424d-8490-2e509c4793b9.jpg)Pueden agregar sus tareas en el prompt :D
**APUNTES:** ![](https://static.platzi.com/media/user_upload/image-e83a8ef1-ace5-4c4b-8f5d-9ab19fc15ec9.jpg)
Loop infinito
\#¿Cuándo usar for o while? Usamos **for** cuando sabemos la cantidad a elementos a iterar/recorrer y **while** cuando no sabemos la cantidad de elementos a recorrer. ------------------------------------------------------------------------------------------------------------------------------------------
💡 **TIP PRO**: * Usa `for...of` para recorrer **valores** de arrays. * Usa `for...in` para recorrer **propiedades** de objetos. * Usa `while` y `do...while` para **condiciones dinámicas**.
```js while(condition) { code } ```
![](https://static.platzi.com/media/user_upload/image-f2c86580-2ea1-4467-9b0c-3035f6692061.jpg)
El ciclo `while` se utiliza para repetir un bloque de código mientras una condición sea verdadera. Por ejemplo, se puede usar para contar hasta un número específico. Este ciclo es útil cuando no se conoce de antemano cuántas iteraciones se necesitarán. Por otro lado, `for...in` se utiliza para iterar sobre las propiedades enumerables de un objeto. Es ideal para recorrer las claves de un objeto, no para contar o realizar repeticiones basadas en una condición. Ambos tienen propósitos diferentes y se utilizan en contextos distintos dentro de JavaScript.
"Si se nos olvida esto... aquí es donde podemos llevar la memoria de nuestro navegador a crashear"... y así fue como trabé mi PC por 10 minutos 😂
```js let diaDeLaSemana = ["lunes", "martes", "miercoles", "jueves", "viernes", "sabado", "domingo"] let i = 0 function escribirDiaDeLaSemana() { while (i < diaDeLaSemana.length){ console.log(diaDeLaSemana[i]) i++ } } escribirDiaDeLaSemana() ```
El ejercicio practico que creé para esta clase, consiste en un contador de la cantidad de clases diarias que veo en Platzi ![]()![](https://static.platzi.com/media/user_upload/image-51986cc3-bcb1-427b-8c3e-128b1ed74ef0.jpg)
```js let palabraMagica = "exit"; // Convertimos la palabra mágica a minúsculas let adivinar = prompt("Adivina la palabra mágica para salir del prompt:").trim().toLowerCase(); while (adivinar !== palabraMagica) { adivinar = prompt("Incorrecto. Intenta nuevamente:").trim().toLowerCase(); } console.log("¡Felicidades! Adivinaste la palabra mágica."); ```let palabraMagica = "exit"; // Convertimos la palabra mágica a minúsculaslet adivinar = prompt("Adivina la palabra mágica para salir del prompt:").trim().toLowerCase(); while (adivinar !== palabraMagica) {  adivinar = prompt("Incorrecto. Intenta nuevamente:").trim().toLowerCase();} console.log("¡Felicidades! Adivinaste la palabra mágica.");
## Método `while` en JavaScript * El método `while` se utiliza para iterar instrucciones en un ciclo hasta que una condición deje de ser verdadera. * Es útil para ejecutar repetidamente un bloque de código mientras se cumpla una condición específica. ## Estructura del Método `while` * La sintaxis básica es: `while (condición) { código a ejecutar }`. * La condición se evalúa antes de cada iteración; si es verdadera, el bloque de código se ejecuta. * Si la condición es falsa desde el principio, el bloque de código no se ejecutará en absoluto. ### Ejemplo de Código let contador = 0; while (contador < 10) { console.log(contador); contador++; } ### Explicación del Código * Declaramos una variable `contador` y la inicializamos en 0. * Usamos el ciclo `while` para iterar mientras `contador` sea menor a 10. * Dentro del bloque `while`, imprimimos el valor de `contador` y luego lo incrementamos en 1 usando `contador++`. ## Precauciones con el Ciclo `while` * Es importante asegurarse de que la condición se volverá falsa en algún momento para evitar loops infinitos. * Un loop infinito puede hacer que el navegador o el entorno de ejecución se queden sin memoria y se bloqueen. ### Ejemplo de Código con Loop Infinito (Evitar) let contador = 0; while (contador < 10) { console.log(contador); // Sin incremento de contador, esto crea un loop infinito } ### Consecuencias de un Loop Infinito * Si olvidamos incrementar `contador`, el ciclo `while` nunca terminará porque la condición siempre será verdadera. * Esto puede causar que el navegador se quede sin memoria y se bloquee. ## Próximos pasos * Practicar con el método `while` en diferentes escenarios para entender mejor su funcionamiento. * Explorar otros métodos de iteración como `for`, `for...in` y `for...of` para compararlos y usarlos adecuadamente. * Aplicar `while` en proyectos más complejos para ver su utilidad en contextos reales.
### **While** El bucle while empieza por evaluar la condición. Si la condición es verdadera (devuelve `true`), entonces las sentencias son ejecutadas. Si la condición es falsa (devuelve `false`), entonces las sentencias no son ejecutadas. Luego el bucle finaliza. ```js // While while (condicion) { // Bloque de código a ejecutar } // --- Ejercicio --- let contador=0; while(contador < 11){ console.log(contador); contador++; } ```