How do I get Javascript to track my score increments?-CodePudding

I am making a basic Rock Paper Scissors game and thought I was coding the score increments correctly, but the game keeps the scores at 0 each round.

I tried initializing the variables within the function as well as globally. I tried adding return in front of the variable increments. I tried with and without the return score statements shown at the end of the playRound() function. I understand that the game either isn't modifying the variable and/or keeps deferring to the initial given value, I just can't figure out why or what I need to do to get the variables to maintain the increments.

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Rock Paper Scissors</title>
</head>

<body>
    <script>
        const choices = ['Rock', 'Paper', 'Scissors'];
        let playerScore = 0;
        let compScore = 0;

        function computerPlay() {
            return choices[Math.floor(Math.random() * choices.length)];
        }

        function playRound(playerSelection, computerSelection, playerScore, compScore) {  
            computerSelection = computerPlay(); 
            playerSelection = prompt("Rock, Paper, or Scissors? ");

            if (playerSelection === 'Rock' && computerSelection === 'Scissors') {
                playerScore  = 1;
                return "You win! Rock beats Scissors!";
            } else if (playerSelection === 'Scissors' && computerSelection === 'Paper') {
                playerScore  = 1;
                return "You win! Scissors beats Paper!";
            } else if (playerSelection === 'Paper' && computerSelection === 'Rock') {
                playerScore  = 1;
                return "You win! Paper beats Rock!";
            } else if (playerSelection === 'Scissors' && computerSelection === 'Rock') {
                compScore  = 1;
                return "You lose! Rock beats Scissors!";
            } else if (playerSelection === 'Paper' && computerSelection === 'Scissors') {
                compScore  = 1;
                return "You lose! Scissors beats Paper!";
            } else if (playerSelection === 'Rock' && computerSelection === 'Paper') {
                compScore  = 1;
                return "You lose! Paper beats Rock!";
            } else {
                playerScore  = 1;
                compScore  = 1;
                return "Tie!"
            }
            return playerScore;
            return compScore;
        }

        function game() {
            for (let i = 0; i < 5; i  ) {
                console.log(playRound());
                console.log(`Your score: ${playerScore}`);
                console.log(`Computer score: ${compScore}`);
            }
            winner();
        }

        function winner() {
            if (compScore > playerScore) {
                console.log("\nThe computer dominated your ass! Better luck next time!")
            } else if (compScore < playerScore) {
                console.log("\nWay to crush it! You win!")
            } else {
                console.log("\nHoly shizzers! It's a tie!")
            }
        }
    </script>
</body>
</html>

CodePudding user response：

There are many ways in which you can improve your code. I removed the arguments of your playRound() function, removed the return statements at the end of that function and added the game() call at the end of your script to make it work.

The arguments in playRound() forced the function to work with undefined local values each time.

You are not checking at all, whether the input given by the user is a valid one.

Maybe you can check out this alternative way of doing the game: rock,paper,scissors?

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Rock Paper Scissors</title>
</head>

<body>
    <script>
        const choices = ['Rock', 'Paper', 'Scissors'];
        let playerScore = 0;
        let compScore = 0;

        function computerPlay() {
            return choices[Math.floor(Math.random() * choices.length)];
        }

        function playRound() {  
            computerSelection = computerPlay(); 
            playerSelection = prompt("Rock, Paper, or Scissors? ");

            if (playerSelection === 'Rock' && computerSelection === 'Scissors') {
                playerScore  = 1;
                return "You win! Rock beats Scissors!";
            } else if (playerSelection === 'Scissors' && computerSelection === 'Paper') {
                playerScore  = 1;
                return "You win! Scissors beats Paper!";
            } else if (playerSelection === 'Paper' && computerSelection === 'Rock') {
                playerScore  = 1;
                return "You win! Paper beats Rock!";
            } else if (playerSelection === 'Scissors' && computerSelection === 'Rock') {
                compScore  = 1;
                return "You lose! Rock beats Scissors!";
            } else if (playerSelection === 'Paper' && computerSelection === 'Scissors') {
                compScore  = 1;
                return "You lose! Scissors beats Paper!";
            } else if (playerSelection === 'Rock' && computerSelection === 'Paper') {
                compScore  = 1;
                return "You lose! Paper beats Rock!";
            } else {
                playerScore  = 1;
                compScore  = 1;
                return "Tie!"
            }
        }

        function game() {
            for (let i = 0; i < 5; i  ) {
                console.log(playRound());
                console.log(`Your score: ${playerScore}`);
                console.log(`Computer score: ${compScore}`);
            }
            winner();
        }

        function winner() {
            if (compScore > playerScore) {
                console.log("\nThe computer dominated your ass! Better luck next time!")
            } else if (compScore < playerScore) {
                console.log("\nWay to crush it! You win!")
            } else {
                console.log("\nHoly shizzers! It's a tie!")
            }
        }
        game();
    </script>
</body>
</html>

CodePudding user response：

I don't know.

But I might have an answer to your problems, which is to stop using global variables.

Once JavaScript executes a return statement, it exits the procedure, so playround's second return will never be called.

So try this...

Remove your global score variables.
Instead of changing the score, change playround to return -1, 0, or 1 based on if computer wins, a tie, or player wins.
In game, declare your two score variables, and increment them within your for loop based on what your playround function returns.
Pass the final score to winner.

This makes more sense as well, because the score is within the scope of a game.

CodePudding user response：

Your game is working now, just know that you didn't handle situation where player enter something outside the three times

            const choices = ['Rock', 'Paper', 'Scissors'];
            let playerScore = 0;
            let compScore = 0;

            function computerPlay() {
                return choices[Math.floor(Math.random() * choices.length)];
            }

            function playRound(playerSelection, computerSelection) {   //2. you decare computer and playerscore twice,
                computerSelection = computerPlay(); 
                playerSelection = prompt("Rock, Paper, or Scissors? ");

                if (playerSelection === 'Rock' && computerSelection === 'Scissors') {
                    playerScore  = 1;
                    return "You win! Rock beats Scissors!";
                } else if (playerSelection === 'Scissors' && computerSelection === 'Paper') {
                    playerScore  = 1;
                    return "You win! Scissors beats Paper!";
                } else if (playerSelection === 'Paper' && computerSelection === 'Rock') {
                    playerScore  = 1;
                    return "You win! Paper beats Rock!";
                } else if (playerSelection === 'Scissors' && computerSelection === 'Rock') {
                    compScore  = 1;
                    return "You lose! Rock beats Scissors!";
                } else if (playerSelection === 'Paper' && computerSelection === 'Scissors') {
                    compScore  = 1;
                    return "You lose! Scissors beats Paper!";
                } else if (playerSelection === 'Rock' && computerSelection === 'Paper') {
                    compScore  = 1;
                    return "You lose! Paper beats Rock!";
                } else {
                    playerScore  = 1;
                    compScore  = 1;
                    return "Tie!"
                }
                return playerScore;
                return compScore;
            }

            function game() { 
                for (let i = 0; i < 5; i  ) {
                    playRound(); //remove console here.
                    console.log(`Computer score: ${compScore}`);
                    console.log(`Your score: ${playerScore}`);
                   }
                winner();
            }

            function winner() {
                if (compScore > playerScore) {
                    console.log("\nThe computer dominated your ass! Better luck next time!")
                } else if (compScore < playerScore) {
                    console.log("\nWay to crush it! You win!")
                } else {
                    console.log("\nHoly shizzers! It's a tie!")
                }
            }

         game()// 1. You didn't call game()