Im having a difficult time trying to get my function to loop using javascript-CodePudding

Hi I am new to JavaScript and I'm trying to make a simple game of rock, paper, scissors that loops five times before declaring a winner. Im not understanding why my loop is not working, I've tried a do while loop, while loop, and finally settled with a for loop yet the function does not seem to loop five times like i would want. Im also having a problem with why the game is return a win or loss of 3 instead of one for just one round. I was hoping that someone could help me out with this it would be greatly appreciated.

  let computerSelection = computerPlay();
    let playerSelection = prompt("Enter your Move");
    let roundWinner;
    let playerWins = 0;
    let computerWins = 0;
    let gameWinner;

function computerPlay(computerSelection =3){
    let choice = Math.floor(Math.random()*computerSelection)  1;
    let answer = "";
    if (choice === 1){ answer = "ROCK"} else if (choice === 2){answer ="PAPER"} else {answer = "SCISSORS"}
    return answer;}
  

function round(playerSelection , computerSelection){
    if (playerSelection.toUpperCase() === "ROCK" && computerSelection === "SCISSORS") {playerWins  = 1}
    else if( playerSelection.toUpperCase() === "ROCK" && computerSelection === "PAPER"){computerWins  = 1} 
    else if(playerSelection.toUpperCase() === "SCISSORS" && computerSelection === "PAPER") {playerWins  = 1}
    else if( playerSelection.toUpperCase() === "SCISSORS" && computerSelection === "ROCK"){computerWins  = 1} 
    else if (playerSelection.toUpperCase() === "PAPER" && computerSelection === "ROCK") {playerWins  = 1}
    else if( playerSelection.toUpperCase() === "PAPER" && computerSelection === "SCISSORS"){computerWins  = 1}
    else if( playerSelection !== computerSelection) {roundWinner = "You entered an invalid input, please try again!"}
    return (playerWins && computerWins)|| roundWinner;}

 


function game(){   
    for ( i = 0; i < 6; i  )  {round(playerSelection,computerSelection); if(playerSelection === computerSelection) {i  = 0} else {i  };} 
  

if (playerWins > computerWins) {gameWinner =`You win! You won ${playerWins} to  ${computerWins}`}
else if (computerWins > playerWins) {gameWinner = `You Lose! You loss ${playerWins} to  ${computerWins}`}
else {gameWinner = roundWinner}

return gameWinner;
}


game();


let message = document.querySelector('main');

message.innerHTML = `<h1>${gameWinner} </h1>`;

* {
    margin: 0px;
    padding: 0px;
    border: 0px;
}

h1 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 500px;
}

<!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">
    <link rel="stylesheet" href="style.css">
    <title>Rock, Paper, Scissors</title>
</head>
<body>
  <main></main>
<script src="game.js"></script>
</body>
</html>

Thanks

CodePudding user response：

I would suggest few changes:

If you want it to loop for 5 times, it is
```
for(i=0;i<5;i  )
```
(loops for i=0,1,2,3,4 -> 5 times)
for computer selection would be better to choose by Math.round instead of Math.floor in my opinion (floor of 1.9 is still 1, round is 2)
```
let choice=Math.round(Math.random()*2) 1;
```
and you can delete parameter of that function.
When you enter players selection and it is the same as computer, it should not return "invalid input" as in your code. I guess it is because of playerSelection === computerSelection, when I changed to playerSelection.toUpperCase() instead, this error disappeared.
Because of the same problem as in previous point, at this part
```
for (i=0;i<6;i  )  
{
  round(playerSelection,computerSelection);
  if(playerSelection === computerSelection)
    {i  = 0}
  else
    {i  } 
}
```
your IF is always false, so you add 1 to 'i', but you loop added one as well, so in the end you added 2. I would use
```
  if(playerSelection.toUpperCase() === computerSelection) {i -= 1;} else {} 
```
in case you don't want draw to be counted. Otherwise this part can be completely missing and the game works well.
When the game ends with a draw, else {gameWinner = roundWinner} can be rewritten to else {gameWinner="It's a draw."}, you solution didn't work for me.
When player enters invalid value and you fixed the loop as @Gil suggested, you run to a problem with undefined result at the end. You can change that line to
```
  else if( playerSelection.toUpperCase() != computerSelection) 
  {
    alert("You entered an invalid input, please try again!"); 
    round(playerSelection,computerSelection);
  } 
```
which fixes the incorrect input and there is no need to rerun whole loop.
And I think it would be easier to use this line
```
  playerSelection=playerSelection.toUpperCase();
```
when you get the user's input, so that you don't need to rewrite it in every IF statment.

CodePudding user response：

The main issue here is the input values.

Your player input and computer input should be invoked every loop, but you used them only once instead of re-declaring them every time. Change this

let computerSelection = computerPlay();
let playerSelection = prompt("Enter your Move");

To this

let computerSelection;
let playerSelection;

Now change the loop to fill the inputs every time

for (let i = 0; i < 6; i  ) {
    // Fill the inputs every loop.
    playerSelection = prompt("Enter your Move");
    computerSelection = computerPlay();
    round(playerSelection,computerSelection);
    if(playerSelection !== computerSelection) {
        i  ;
    }
}