Rock, Paper, Scissors - Task

I’m currently on the Rock, Paper, Scissors task in the introduction to JS course, and have a question with regards to the bottom of my code and why it wouldn’t work, compared to the example given. Can you not use the && in this instance? Why does there need to be another embedded IF statement?

Mainly that I decided to use:
if (userChoice === ‘scissors’ && ComputerChoice === ‘rock’) {
return ‘The computer has won!’;
} else {
return ‘You have won!’
}

The code they have advised to use is:
if (userChoice === ‘rock’) {
if (computerChoice === ‘paper’) {
return ‘Sorry, computer won!’;
} else {
return “Congratulations, you won!”;
}

const getUserChoice = userInput => {
  userInput = userInput.toLowerCase();
  if (userInput === 'rock' || userInput === 'paper' || userInput === 'scissors') {
    return userInput;
  } else {
    console.log('Error, please type rock, paper or scissors');
  }
}

const getComputerChoice = () => {
 const randomNumber = Math.floor(Math.random() * 3);
  switch (randomNumber) {
    case 0:
      return 'rock';
    case 1:
      return 'paper';
    case 2:
      return 'scissors';
  }
}


const determineWinner = (userChoice, computerChoice) => {
  if (userChoice === computerChoice) {
    return 'Tie!'
  }
    if (userChoice === 'rock' && computerChoice === 'paper') {
    return 'The computer has won!';
  } else {
    return 'You have won!';
  }
    if (userChoice === 'paper' && computerChoice === 'scissors') {
      return 'The computer has won!';
    } else {
    return 'You have won!'
    } 
  if (userChoice === 'scissors' && ComputerChoice ==='rock') {
    return 'The computer has won!';
  } else {
    return 'You have won!'
  }
  
console.log(determineWinner('paper', 'scissors'));
  
}

You are not passing strings as arguments for determineWinner.

console.log(determineWinner('paper', 'scissors'));

Hi, yes, thanks I have noticed this since and will amend in the original post. My question was more about the syntax though.

e.g.

  if (userChoice === 'scissors' && ComputerChoice === 'rock') {
    return 'The computer has won!';
  } else {
    return 'You have won!'
  }

VS.

  if (userChoice === 'scissors') {
    if (ComputerChoice === 'rock') {
    return 'The computer has won!';
  } else {
    return 'You have won!'
  }

Well for a start, you have capitalized the variable names :wink:

ComputerChoice should be computerChoice

But the && operator should work.

The problem with your code is that if your if statement conditions are not met it will always say ‘You have won’ no matter what the choices are. Do you see why?

Hi, oops! I should’ve cleaned up the rest of the code before posting, my bad!

const determineWinner = (userChoice, computerChoice) => {
  if (userChoice === computerChoice) {
    return 'Tie!'
  }
    if (userChoice === 'rock' && computerChoice === 'paper') {
    return 'The computer has won!';
  } else {
    return 'You have won!';

From what I understand in the code written above:

  • As userChoice === computerChoice is at the top, this would always be the first output if correct.
  • The other 2 options would be ‘rock’ and ‘paper’ which would output ‘The computer has won!’
  • This would leave only 1 other outcome which would be ‘rock’ and ‘scissors’ which would output the else statement ‘You have won!’

Is there something i’m misunderstanding?

Luckily there are only few choice combinations/conditions in this game. Right now you only have 2 covered, all ties and rock versus paper. All other combination will currently result in ‘You have won’.

The difference between your code and the example is as follows. Your code

if (userChoice === 'scissors' && ComputerChoice === 'rock') {
    return 'The computer has won!';
} else {
    return 'You have won!'
}

Will evaluate all combinations other than scissors vs rock as a win.

Whilst the example code:

if (userChoice === 'scissors') {
  if (ComputerChoice === 'rock') {
    return 'The computer has won!';
  } else {
    return 'You have won!'
  }
} // you missed this closing bracket

Will first check if your choice is ‘scissors’.

If not it will skip the whole part and move to the next if statement
(for example, if (userChoice === 'paper')).

If you did pick ‘scissors’, only then will it compare with the computerChoice.

Your choice of using the && operator is good but you need to design your code slightly different.

Ah I see, so just to clarify: As there is only 3 options in this example and 1 of the outcomes is already defined, the code should work fine here.

However… it is bad practice as if there were to be 4 options, this would leave the 4th option undefined and I would need to change to IF, IF instead of the && syntax anyway to account for the new option?

Thanks

Not at all, you could use else if statements :wink:

if (userChoice === 'scissors' && ComputerChoice === 'rock') {
    return 'The computer has won!';
} else if (userChoice === 'paper' && ComputerChoice === 'scissors') {
    return 'The computer has won!';
} else {
    return 'You have won!'
}

If it fails the if statement it will check the next condition. You can add as many else if statements you like. As long as you keep including your else as default. If all else if statements fail it will have to fall back to your default.

That makes sense, thank you!