Why does my function return undefined even if I defined it?-CodePudding

This is for the Rock, Paper, Scissors task from The Odin Project. The playerSelection and computerSelection variables are undefined when I run the code. Why does it show undefined even if I defined those variables?

let playerScore = 0;
let computerScore = 0;
let playerSelection = 'scissors';

const choices = ['rock', 'paper', 'scissors'];

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

console.log(`Player Score: ${playerScore}`);
console.log(`Computer Score: ${computerScore}`);
console.log(`Computer picked ${computerPlay()}`);


function playRound(playerSelection, computerSelection) {
    if (computerSelection === playerSelection) {
        console.log(`${playerSelection} vs. ${computerSelection}. It's a tie!`);
    }
    else if (computerSelection === 'rock' && playerSelection === 'scissors'){
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    }
    else if (computerSelection === 'paper' && playerSelection === 'rock'){
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    }
    else if (computerSelection === 'scissors' && playerSelection === 'paper'){
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    }
    else if (playerScore === 'rock' && computerSelection === 'scissors'){
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }
    else if (playerScore === 'paper' && computerSelection === 'rock'){
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }
    else (playerScore === 'scissors' && computerSelection === 'paper') 
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }

playRound();

CodePudding user response：

You forgot to pass the arguments to your function.

playRound(compuplayerSelection, computerSelection);

Also you wrote in the win statements playerScore instead of playerSelection and you forgot to put the "if" to the last one.

let playerScore = 0;
let computerScore = 0;
let playerSelection = 'scissors';

const choices = ['rock', 'paper', 'scissors'];

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

console.log(`Player Score: ${playerScore}`);
console.log(`Computer Score: ${computerScore}`);
console.log(`Computer picked ${computerPlay()}`);


function playRound(playerSelection, computerSelection) {
    if (computerSelection === playerSelection) {
        console.log(`${playerSelection} vs. ${computerSelection}. It's a tie!`);
    }
    else if (computerSelection === 'rock' && playerSelection === 'scissors'){
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    }
    else if (computerSelection === 'paper' && playerSelection === 'rock'){
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    }
    else if (computerSelection === 'scissors' && playerSelection === 'paper'){
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    }
    else if (playerSelection === 'rock' && computerSelection === 'scissors'){
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }
    else if (playerSelection === 'paper' && computerSelection === 'rock'){
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }
    else if (playerSelection === 'scissors' && computerSelection === 'paper') 
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }

playRound(playerSelection, computerSelection);

CodePudding user response：

You are relying on this call to computerPlayer

console.log(`Computer picked ${computerPlay()}`);

to create the global variable computerSelection here

return computerSelection = choices[computerResult];

You then shadow these global variables within the scope of playRound by defining the arguments to have the same identifiers.

function playRound(playerSelection, computerSelection) {

The quick and messy fix is to call playRound, passing in the variables from the outer scope

playRound(playerSelection, computerSelection)

playRound has unbalanced curly braces, and typos like playerScore === 'rock' and else instead of else if.

These lines are creating an array which contains a single number in the range [0, 2].

let computerResult = [Math.floor(Math.random() * choices.length)];
return computerSelection = choices[computerResult];

and using this array as the index of another array. This barely works due to type coercion.

Consider some refactoring, to restructure this code to rely less on spawning and using globals in strange places.

You also do not need to exhaustively check every combination of possibilities. If you have checked for all the outcomes where the player does not win, then all that is left are the outcomes where the player does win.

An example:

const rps = [ 'rock', 'paper', 'scissors' ];

let playerScore = 0;
let computerScore = 0;

const pickRandom = arr => arr[Math.floor(Math.random() * arr.length)];

const playRound = (playerSelection, computerSelection) => {
    if (computerSelection === playerSelection) {
        console.log(`${playerSelection} vs. ${computerSelection}. It's a tie!`);
    } else if (
        (computerSelection === 'rock' && playerSelection === 'scissors') ||
        (computerSelection === 'paper' && playerSelection === 'rock') ||
        (computerSelection === 'scissors' && playerSelection === 'paper')
    ) {
        console.log(`${playerSelection} vs. ${computerSelection}. You lose! Try again next time.`);
        computerScore  ;
    } else {
        console.log(`${playerSelection} vs. ${computerSelection}. You win!`);
        playerScore  ;
    }
};

let rounds = 3;

while (rounds--) {
    let playerChoice = 'scissors'; // make this interactive!
    let computerChoice = pickRandom(rps);

    console.log(`Player picked: ${playerChoice}`);
    console.log(`Computer picked ${computerChoice}`);

    playRound(playerChoice, computerChoice);

    console.log(`Player Score: ${playerScore}`);
    console.log(`Computer Score: ${computerScore}`);
}

Might want to quickly shift towards an object-oriented approach quickly though, to detangle more globals, and contain the game's state in a single object.