Calling random returns same value all the time, expect I refresh browser

Get Help JavaScript
,
#1

I’m a beginner and want to program rock, paper, scissor. Please excuse if my style of asking or and coding may be not on a high level yet.

Meanwhile, the comparison function playRound get the playerSelection (as per his clicked button), but the needed value from computerSelection returns always the same value. Always means after each time, the user clicked any button. When the user refresh the browser, random will be another value. I also tried to migrate the function computerPlay into the function playRound, which wasn’t helping at all. Can someone give me a hint? THANKS!

<body>
  
  <div class="buttons">
    <button class="button" value="rock">Rock</button>
    <button class="button" value="paper">Paper</button>
    <button class="button" value="scissors">Scissor</button>
  </div>

  <script>

    var buttons = document.getElementsByClassName("button");

    for (var i = 0; i < buttons.length; i++) {
        buttons[i].addEventListener("click", function (e) {
          playerSelection = e.target.value;
          playRound(playerSelection);
      });
    };

    function computerPlay(){
      const shapes = ['rock', 'paper', 'scissors'];
      const random = Math.floor(Math.random() * shapes.length);
      return(shapes[random]);
    };

    let computerSelection = computerPlay();

    function playRound (playerSelection){
      if (playerSelection === computerSelection){
        console.log("Tie! Repeat to break the tie");
      }else if (playerSelection === 'rock' && computerSelection === 'paper'){
        console.log("You Lose! Paper beats Rock");
      }else if (playerSelection === 'rock' && computerSelection === 'scissors'){
        console.log("You Win! Rock beats Scissors");
      }else if (playerSelection === 'paper' && computerSelection === 'rock'){
        console.log("You Win! Paper beats Rock");
      }else if (playerSelection === 'paper' && computerSelection === 'scissors'){
        console.log("You Lose! Scissors beats Paper");
      }else if (playerSelection === 'scissors' && computerSelection === 'rock'){
        console.log("You Lose! Rock beats Scissors");
      }else if (playerSelection === 'scissors' && computerSelection === 'paper'){
        console.log("You Win! Scissors beats Paper");
      }else{
        console.log("Invalid input! Please try again");
      }
    };

  </script>
</body>
#2

This line of code now only runs when the program loads:

let computerSelection = computerPlay();

computerSelection = ComputerPlay() is not called again from the EventListener or playRound function. From this point on the computerSelection variable has a value of ‘rock’, ‘paper’ or ‘scissors’. You should make sure that this randomizing function gets called when the event-listener is triggered again. One option would be to move this line of code inside and at the beginning of the playRound() function in order to make sure it gets called every round.

1 Like
#3

Thanks Mike, you made me a lucky men :grin: