CODEWITHSUNDEEP
javascripthtml
vivgarcia
vivgarcia

Reputation: 3

Reset function is not working for JavaScript game

I am new to programming, and I am creating a psychic game where you guess the letter the computer created.

For some reason, when you select the letter the computer chose, the reset(); function is not causing the guesses to reset, and still uses the previous computer guess as the letter, even though the reset(); function creates a new computer guess. I've Googled this and haven't been able to find anything to answer my question. I'm not sure what I'm doing wrong. 

        <!DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Psychic Game</title>
        </head>
        <body>

            <div class="container">
                <h1>The Psychic Game</h1>

                <p><span id=main-text>Guess what letter I'm thinking of?</span></p>

                <P>Wins: <span id="wins">0</span> </P>

                <P>Losses: <span id="losses">0</span></P>

                <p>Guesses left: <span id="guessesLeft">10</span></p>

                <p>Your guesses so far:<span id="guessedLetters"> </span></p>
            </div>
    </body>
    </html>

JavScript:

    var alphabet = ["a", "b", "c", "d", "e", "f", "g", "h", "i",
    "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"];

    var wins = 0;
    var losses = 0;
    var guessesLeft = 10;
    var guessedLetters = [];


    //generate random letter

    var randomLetter = Math.floor(Math.random() * alphabet.length);
    var computerChoice = alphabet[randomLetter];
    console.log("The computer choose " + computerChoice);

    //reset function
    function reset(){
        guessesLeft = 10;
        guessedLetters = [];
        var randomLetter = Math.floor(Math.random() * alphabet.length);
        var computerChoice = alphabet[randomLetter];
        console.log("The computer choose " + computerChoice);
    }

    //event listener for keyup event
    document.onkeyup = function(event){
        //user makes choice
        var userChoice = event.key;
        //double check userChoice is viable
        var viableChoice = /[a-z]/gi;
        if (!viableChoice.test(userChoice)) {
        alert("please enter a letter");
        }
        else {
        console.log(userChoice);
        }
        //if user guesses the right letter
        if(userChoice !== computerChoice){
            guessesLeft--;
            document.getElementById("guessesLeft").innerText = guessesLeft;
            document.getElementById("main-text").innerText = "Try again!";
            guessedLetters.push(userChoice);
            document.getElementById("guessedLetters").innerText = guessedLetters;
        } else if(userChoice === computerChoice){
            wins++;
            alert("You won!");
            document.getElementById("wins").innerText = wins;
            reset();
        }
        if(guessesLeft === 0){
            losses++;
            document.getElementById("main-text").innerText = "You lose! Try again";
          reset();
        }
    }

Upvotes: 0

Views: 82

Answers (1)

Zen Monkey
Zen Monkey

Reputation: 101

In your reset() function,

var randomLetter = Math.floor(Math.random() * alphabet.length);
        var computerChoice = alphabet[randomLetter];

should be

randomLetter = Math.floor(Math.random() * alphabet.length);
        computerChoice = alphabet[randomLetter];

You are defining new local vars when you just want to update the old ones.

Upvotes: 3

Related Questions