Help understanding multiple conditionals (Rock, Paper Scissors)

In the “Rock, Paper, or Scissors” objective in the “learn Javascript” course (https://www.codecademy.com/courses/introduction-to-javascript/projects/rock-paper-scissors-javascript), I understand the proper method to complete this objective would be to nest ‘if’ statements within ‘if’ statements

Like:

if (userChoice === 'rock') {
  if (computerChoice === 'paper') {
     return 'computer wins!';
     } else {
       return "you win!';
     }
    }

I was wanting to try and use some of the ‘&&’ conditionals I had learned earlier in the course to see if they would also work. The code runs, and it works in the event of a tie, and also works on the first user v computer scenario; but the remaining two always return ‘you win’ no matter what combination I use.
I was hoping someone could help me understand why. Have I made an error, or is it something that wouldn’t be able to run after the first if/else is complete?

This is my code for it :

  const determineWinner = (userChoice, computerChoice) => {
    if (userChoice === computerChoice) {
      return 'tie';
      }

    if (userChoice === 'rock' && computerChoice === 'paper') {
      return 'computer wins!';
     }
     else {return 'you win!';}


   if (userChoice === 'paper' &&
  computerChoice === 'scissors') {
      return 'computer wins!';
      }
      else {return 'you win!';}

   if (userChoice === 'scissors' &&
  computerChoice === 'rock') {
      return 'computer wins!';
      }
     else {return 'you win!';}
 };


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

Thank You,

Remember what return does. Is there any path for control to flow past this conditional to the next if?

Ah, I see. So the first ‘else {return}’ it meets completes the code because everything after is an else to it?

Not exactly. The first part of your statement is true. Once a return is reached, the value following the return keyword is handed back to the caller along with control, so no code following an executed return statement in a function will be reached. You can do what you attempted, you just have to make sure that a return isn’t reached until your ready to end the function.

Hint
//One possibility
const winner = (a, b) => {
  if (/*something && something where computer wins*/) {
    return 'computer wins';
  } else if (/*something && something where computer wins*/) {
    return 'computer wins';
  } else if (/*something && something where computer wins*/) {
    return 'computer wins';
  } else {
    return 'you win!';
  }
}
//Another
const winner = (a, b) => {
  if (/*something && something where computer wins*/) {
    return 'computer wins';
  } 
  if (/*something && something where computer wins*/) {
    return 'computer wins';
  }
  if (/*something && something where computer wins*/) {
    return 'computer wins';
  }
  return 'you win!'; //if control flow makes it to here, the computer didn't win, so you can simply return the alternative
}

For a bit of a challenge, you could consider how you could refactor you code into a single conditional statement by combining the use of && with the use of ||.

Thank you! I understand now. I had thought maybe I should have been using else/if statements, but when I tried I was putting them in the wrong place (before the return) and not considering flow; I see how that’s interrupted the flow and the code has halted where it did. The second option, and the single conditional statement didn’t occur to me either, so I will try them now. Thanks so much, that’s a great help!

1 Like