Enseñar a JS tratando de hacer un juego de ticatactoe y tuvo un problema con la recursividad, específicamente con 'Se excedió el tamaño máximo de la pila de llamadas'.
Cuando trato de hacer un movimiento aleatorio por parte del jugador de la computadora, hago un número aleatorio, que luego se verificará por su valor en una matriz llamada gameState. Entonces, si este valor ya se ha definido (hay una marca X u O en una celda), necesito generar un número aleatorio nuevamente. Entonces, necesito detener este ciclo infinito cuando todas las celdas estén marcadas o recibiré el error "Se excedió el tamaño máximo de la pila de llamadas".
¿Puede echar un vistazo, estoy haciendo lo correcto o generalmente es incorrecto? En realidad, pensé en otra implementación de esta escena del juego, pero pensé que si comenzaba con eso, debería llevar esto hasta el final.
let gameState = ["", "", "", "", "", "", "", "", "",]; let playerAi = "O"; // ai's turn function playerAiTurn() { let randomNum = Math.floor(Math.random() * gameState.length); if (gameState[randomNum] === '') { gameState[randomNum] = playerAi; document.getElementById(randomNum).innerHTML = playerAi; resultCheck(); } else { playerAiTurn() }; };Existe una posibilidad muy pequeña de que las llamadas aleatorias repetidas sigan obteniendo el mismo número, por lo que no es correcto estrictamente hablando simplemente seguir lanzando números aleatorios (aunque en la práctica es muy poco probable que se encuentre alguna vez).
Para evitar la situación con certeza, solo se debe tomar un número aleatorio basado en los lugares no utilizados. Por ejemplo:
let gameState = ["", "", "", "", "", "", "", "", "",]; let playerAi = "O"; // ai's turn function playerAiTurn() { let unusedPlaces = []; for(let i=0; i<gameState.length; i++) { if( gameState[i] === "") unusedPlaces.push(i); } if( unusedPlaces.length > 0 ){ let randomUnusedPlace = unusedPlaces [ Math.floor(Math.random() * unusedPlaces.length) ]; gameState[randomUnusedPlace] = playerAi document.getElementById(randomUnusedPlace).innerHTML = playerAi; } resultCheck(); }Sin llamadas recursivas.
Tienes que comprobar cuando el juego ha terminado y detener las llamadas recursivas. No conozco la implementación de resultCheck , pero debería devolver información sobre si el juego está terminado o no. Si está terminado, no haga la llamada recursiva.
Dicho esto, el rendimiento de su código es impredecible porque genera números aleatorios incluso antes de saber si la ranura resultante está disponible. Podrías optimizarlo así:
const gameState = ["", "", "", "", "", "", "", "", "",]; const playerAi = "O"; function playerAiTurn() { const emptySlots = Array.from(gameState.entries()).filter(([, x]) => x === ''); if(!emptySlots.length) return; //Game over const randomNum = Math.floor(Math.random() * emptySlots.length); const [index] = emptySlots[randomNum]; gameState[index] = playerAi; document.getElementById(index).innerHTML = playerAi; resultCheck(); };