Javascript – JS Rock Paper Scissors – playerSelection is not defined

ReferenceError is because the playerSelection variable is not defined within the game function. You can pass playerSelection as a parameter to the game function, and you should also return the result of each round from the playRound function. I’ve tried to modified above code, havn’t tested but you can check yourself.

Code:

const options = ["rock", "paper", "scissors"];
const rock = document.querySelector("#rock");
const paper = document.querySelector("#paper");
const scissors = document.querySelector("#scissors");

// Initialize playerSelection
let playerSelection = "";

// Get player's selection
function clickListener(event) {
    playerSelection = event.target.id;
    const computerSelection = getComputerChoice();
    playRound(playerSelection, computerSelection);
}

rock.addEventListener("click", clickListener);
paper.addEventListener("click", clickListener);
scissors.addEventListener("click", clickListener);

function getComputerChoice() {
    const choice = options[Math.floor(Math.random() * options.length)];
    return choice;
}

//check the winner
function checkWinner(playerSelection, computerSelection) {
  if (playerSelection == computerSelection) {
    return "Tie";
  } else if (
    (playerSelection == "rock" && computerSelection == "scissors") ||
    (playerSelection == "scissors" && computerSelection == "paper") ||
    (playerSelection == "paper" && computerSelection == "rock")
  ) {
    return "Player";
  } else {
    return "Computer";
  }
}

// play 1 round 
function playRound(playerSelection, computerSelection) {
  const result = checkWinner(playerSelection, computerSelection);
  if (result == "Tie") {
    return "It's a Tie!";
  } else if (result == "Player") {
    return `You Win! ${playerSelection} beats ${computerSelection}`;
  } else {
    return `You Lose! ${computerSelection} beats ${playerSelection}`;
  }
}

// Game
function game(playerSelection) {
    let scorePlayer = 0;
    let scoreComputer = 0;
    console.log("Welcome!");
    for (let i = 0; i < 5; i++) {
        const computerSelection = getComputerChoice();
        const result = playRound(playerSelection, computerSelection);
        console.log(result);
        if (result === "You Win!") {
            scorePlayer++;
        } else if (result === "You Lose!") {
            scoreComputer++;
        }
    }
    console.log("Game Over");
    if (scorePlayer > scoreComputer) {
        console.log("Player was the winner");
    } else if (scorePlayer < scoreComputer) {
        console.log("Computer was the winner");
    } else {
        console.log("We have a tie!");
    }
}

// Function to play the game one more time
const play = document.querySelector("#play");
play.addEventListener("click", playAgain);

function playAgain() {
    game(playerSelection);
}

// Start the game
game(playerSelection);