Aprender a programar un juego de piedra, papel o tijera en JavaScript se vuelve mucho más interesante cuando descubres cómo repetir acciones hasta que se cumpla una condición. Aquí entra en juego el bucle while, una instrucción que controla el flujo de tu código y te permite construir lógicas dinámicas como un combate al mejor de tres.
¿Qué es una instrucción while y cómo funciona?
Una instrucción modifica el flujo del código mientras este se ejecuta. Ya conoces el if, que decide entre dos caminos según una condición. El while va un paso más allá: repite un bloque de código mientras una condición sea verdadera.
¿Qué hace un bucle while? Ejecuta repetidamente las instrucciones dentro de sus llaves mientras la condición entre paréntesis siga siendo verdadera. Cuando la condición se vuelve falsa, el ciclo termina y el programa continúa.
La sintaxis es muy parecida a la de una función: escribes while, abres paréntesis con la condición, y luego abres llaves con el código que se repetirá. La identación dentro de las llaves no es un capricho estético, te ayuda a saber dónde empieza y termina el ciclo.
¿Cómo construir un combate al mejor de tres con while?
La idea es sencilla: el juego debe repetirse hasta que el jugador o la computadora acumulen tres victorias. Para lograrlo, necesitas llevar un registro tanto de los triunfos como de las pérdidas.
¿Qué variables necesitas declarar antes del bucle?
Antes de entrar al while, declara dos contadores que arrancan en cero. Estos son los que vas a evaluar en la condición y los que irás modificando dentro del ciclo.
- triunfos inicia en 0 y suma uno cada vez que el jugador gana.
- pérdidas inicia en 0 y suma uno cada vez que el jugador pierde.
- PC y jugador también inician en 0, pero se actualizan dentro del ciclo.
La condición que controla el ciclo combina ambos contadores con el operador lógico && (doble ampersand, que significa "y"): while (triunfos < 3 && pérdidas < 3). Mientras ninguno llegue a tres, el combate continúa [04:07].
¿Por qué el aleatorio del PC y el prompt del jugador van dentro del while?
Cada iteración del ciclo representa una ronda nueva. Si dejas el número aleatorio del PC fuera del while, la computadora elegiría una sola vez y repetiría esa misma jugada eternamente. Lo mismo aplica al prompt del jugador: necesita preguntarse en cada vuelta.
Por eso, dentro del bucle se asigna PC = aleatorio(...) y se vuelve a pedir la elección del jugador con un prompt en cada ronda [05:30].
¿Cómo actualizar contadores dentro del ciclo?
Aquí está el corazón del asunto. Cada vez que el jugador gana, ejecutas triunfos = triunfos + 1. Esto toma el valor actual de la variable, le suma uno y reasigna el resultado a la misma variable.
Si triunfos vale 2 y vuelves a ganar, la operación queda como 2 + 1 = 3, y ese 3 se guarda en triunfos. Cuando pierdes, no le restas al triunfo, le sumas uno a las pérdidas con pérdidas = pérdidas + 1, porque una pérdida tuya es básicamente un triunfo de la máquina.
¿Qué significa triunfos = triunfos + 1? Es una reasignación: tomas el valor actual de triunfos, le sumas uno y guardas el nuevo valor en la misma variable. Así el contador crece con cada victoria.
Al final del ciclo, fuera de las llaves del while, puedes mostrar un alert con el resumen: "ganaste " + triunfos + " veces. perdiste " + pérdidas + " veces.". Recuerda los espacios entre comillas para que el texto no quede pegado a los números [07:30].
¿Qué es un loop infinito y por qué debes evitarlo?
Un loop infinito ocurre cuando la condición que permite salir del ciclo nunca se vuelve falsa. Si comentas las líneas que suman a triunfos y pérdidas, ambas variables se quedan en cero para siempre, y la condición triunfos < 3 && pérdidas < 3 siempre será verdadera.
El resultado es que el juego nunca termina. La computadora sigue ejecutando el bucle vuelta tras vuelta, sin pausa. Esta es una de las razones por las que a veces tu navegador se pone lento o se traba: un programador olvidó modificar la variable que rompe el ciclo [09:50].
Los navegadores modernos detectan estos casos y muestran un aviso preguntando si quieres detener el script. Pero la lección de fondo es clara: todo bucle while necesita una salida garantizada, una condición que en algún momento deje de cumplirse.
¿Cómo refactorizar el código para hacerlo más limpio?
Dentro del while hay mucho código repetido. Cada rama del combate tiene su propio triunfos = triunfos + 1 o pérdidas = pérdidas + 1, y eso se puede comprimir.
El reto es mover toda la lógica del combate a una función propia, de modo que dentro del while solo tengas una o dos líneas que llamen a esa función y actualicen los contadores. Idealmente, debería existir una sola línea que sume a triunfos y otra única línea que sume a pérdidas.
Programar es manejar la frustración. Cuando te falte una comilla o un signo de más, respira y revisa con calma. ¿Cómo refactorizaste tú el combate? Comparte tu versión en los comentarios y muéstranos cómo dejaste el código.