Buenas amigo en esta estoy estudiando basado en la metodología THE ODIN PROJECT que por cierto es muy bueno pero hay ciertas cosillas de la que creo que se pasan por alto (sin mencionar que todo es en ingles), lo cierto es que me parece muy buen inicio para comenzar esta maravillosa carrera. He investigado en los comentarios de THE ODIN PROJECT y visto varios de los códigos ya creados por otros programadores donde en esta prueba del Piedra, Papel y Tijera es donde muchos abandonan y YO aún no me doy por vencido pues creo mucho en la comunidad. A lo que voy, he intentado hacer todo sin trampas pero no puedo evitar ver los códigos de otros programadores para tratar de entender donde estoy fallando (yo creo que es algo natural) lo cierto es que en muchos código ya escritos, estos maravillosos programadores son de técnicas avanzadas donde veo que según lo que exige el proyecto como que se saltan ciertos pasos o les colocan su toque personal y bueno me es difícil llevarme al pie de letra, este es el codigo que he hecho.
// Crear una funcion que desvuelva al azar PIEDRA, PAPEL O TIJERA
// Variables globales a usar
let puntajeJugador = 0;
let puntajeMaquina = 0;
let playerSelection;
let computerSelection = computerPlay();
// Creando una funcion para iniciar el prompt
function emergente() {
playerSelection = prompt("¿Qué eliges?\nPiedra\nPapel\nTijera", "Piedra");;
let mensaje;
if (playerSelection == null || playerSelection == " ") {
mensaje = "Debes escribir algo o no podra jugar"
} else {
return playRound(playerSelection, computerSelection)
}
document.querySelector(".per").innerHTML = mensaje
}
function computerPlay() {
let opcionAzar = Math.floor(Math.random() * 3)
switch (opcionAzar) {
case 0:
return 'Piedra'
case 1:
return 'Papel'
case 2:
return 'Tijera'
}
}
function playRound(playerSelection, computerSelection) {
if (playerSelection == computerSelection) {
document.querySelector(".per").innerHTML = "Estan empatados ambos han seleccionado " + playerSelection
}
else if (playerSelection == "Piedra") {
if (computerSelection == "Papel") {
document.querySelector(".per").innerHTML = "Has PERDIDO! " + computerSelection + " gana a " + playerSelection;
document.querySelector(".per").innerHTML = "Has perdido" + puntajeMaquina + " "
puntajeMaquina++;
}
if (computerSelection == "Tijera") {
document.querySelector(".per").innerHTML = "Has GANADO! " + playerSelection + " gana a " + computerSelection
document.querySelector(".per").innerHTML = "Has ganado, tu puntaje es " + puntajeJugador + " "
puntajeJugador++;
}
}
else if (playerSelection == "Papel") {
if (computerSelection == "Tijera") {
document.querySelector(".per").innerHTML = "Has PERDIDO! " + computerSelection + " gana a " + playerSelection;
document.querySelector(".per").innerHTML = "Has perdido" + puntajeMaquina + " "
puntajeMaquina++;
}
if (computerSelection == "Piedra") {
document.querySelector(".per").innerHTML = "Has GANADO! " + playerSelection + " gana a " + computerSelection;
document.querySelector(".per").innerHTML = "Has ganado, tu puntaje es " + puntajeJugador + " "
puntajeJugador++;
}
}
else if (playerSelection == "Tijera") {
if (computerSelection == "Piedra") {
document.querySelector(".per").innerHTML = "Has PERDIDO! " + computerSelection + " gana a " + playerSelection;
document.querySelector(".per").innerHTML = "Has perdido" + puntajeMaquina + " "
puntajeMaquina++;
}
if (computerSelection == "Papel") {
document.querySelector(".per").innerHTML = "Has GANADO! " + playerSelection + " gana a " + computerSelection;
document.querySelector(".per").innerHTML = "Has ganado, tu puntaje es " + puntajeJugador + " "
puntajeJugador++;
}
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Piedra, Papel, Tijera</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="contenedor">
<h1>El resultado es:</h1>
<button onclick="emergente()">clic</button>
<p class="per"></p>
</div>
<script src="index.js"></script>
</body>
</html>
CODIGO JS
/* Escriba una NUEVA función llamada game(). Utilice la función anterior dentro de este para jugar un juego de 5 rondas que mantiene la puntuación e informa un ganador o perdedor al final. */
/* function game() {
//let ronda = playRound(playerSelection, computerSelection)
if (playerSelection.search("Has GANADO!")) {
document.querySelector(".per").innerHTML ="Tu puntaje es " + puntajeJugador + " "
puntajeJugador++;
puntajeJugador++
//console.log("Tu puntaje ahora es "+puntajeJugador+" ")
console.log("Entre en he GANADO!")
} else if (computerSelection.search("Has PERDIDO! ")) {
document.querySelector(".per").innerHTML = "Has perdido" + puntajeMaquina +" "
puntajeMaquina++;
puntajeMaquina++
console.log("El puntaje de la Maquina es "+puntajeMaquina+" ")
console.log("Entre en he PERDIDO!")
}
console.log("click")
console.log(playerSelection)
}*/
La función que esta comentada game()
la vi como algo muy innecesario y me he saltado esa parte pues realmente no he podido hacerla funcionar; lo que quisiera en que me ayudaran y es que he buscado un sin fin de info donde no le veo mi falla y que me tiene mas de una semana estancado es y es que Cuando se ejecuta la función prompt()
en este agrego mi opción que predeterminadamente tengo PIEDRA y cuando la ejecuto esta me da el resultado, pero si le doy clic de nuevo al botón solo me da como resultado lo que ya haya elegido primeramente, es decir lo mismo a menos que reinicie el navegador y allí si! me da otra opción pero pierdo lo que llevo de puntuación ¿Que debiese corregir en ello? por favor.