Can someone explain this block of code that contains an if else statement to me?

Question

I am relearning basics of if / else statements, as they were my weak point in school.

I am taking a java script course on code academy and I am at the point of if statements. The example that I am confused on is this:

if (userChoice === 'rock') {
  if (computerChoice === 'paper') {
    return 'The computer won!';
  } else {
    return 'You won!';
  }
}

Is the else statement considering the userChoice equaling to 'scissors'?

or is it switching the userChoice to 'paper' and computerChoice to 'rock'?

I know this is really basic stuff, but it always confused me.

The whole function is below

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

    if (userChoice === 'rock') {
        if (computerChoice === 'paper') {
            return 'The computer won!';
        } else {
            return 'You won!';
        }
    }

    if (userChoice === 'paper') {
        if (computerChoice === "scissors") {
            return 'The computer won!';
        } else {
            return 'you won!';
        }
    }

    if (userChoice === 'scissors') {
        if (computerChoice === "rock") {
            return 'The computer won!';
        } else {
            return 'you won!';
        }
    }

    if (userChoice === 'bomb') {
        return 'Bomb beats all';
    }

}

Answer 1

This is basically what your if statement does:

if (computerChoice === 'paper') {
    return 'The computer won!';
} if (computerChoice !== 'paper') {
    return 'You won!';
}

The else statement is called if the if statement is false - so if computerChoice is anything that's not exactly paper , the else statement is called. A standard if-else will always output, as there are only two pathways - equal or not equal. There's no in-between.

Answer 2

Here is the explination:

Note: === checks the value as well as its type

if (userChoice === 'rock') { // if **userChoice** is of string **rock** that means the if condition is true and it will continue execiting the code inside if
  if (computerChoice === 'paper') { // if **computerChoice** is of string **paper** it executes code inside and returns 'the computer has won ' 
    return 'The computer won!';
  } else { // if **computerChoice** was not of **string** paper it executes 'You won' because the computer chose scissors
    return 'You won!';
  }
}

this code executes if userChoice is same as computerChoice

if(userChoice === computerChoice){
  return 'It is a tie!';
}

Answer 3

In this example userChoice value is usually being checked first, assuming it is not equal to computerChoice - in this case, we check both values and compare them to each other.

So after the first if block is matched, then the second match is being validated which is to find the value of computerChoice .

Let's assume this scenario: userChoice = 'scissors'

We need to check what is the value of computerChoice . If the value of computerChoice is not 'scissors', then we know it is not going to be a tie. We have to look for another match.

We found the block that matches the first condition:

if (userChoice === 'scissors'){}

Now we need to have a look at what is inside this if statement, we have:

  if (computerChoice === "rock"){
    return 'The computer won!';
  } else {
    return 'you won!';
  }

This means that if computerChoice = 'rock' then it will return 'The computer won!'

In case if computerChoice is anything else than 'rock' the else statement will run which will return 'you won!' .

Important note: the code executes from top to bottom (with few exemptions ), for that reason this block is being checked first:

if(userChoice === computerChoice){
  return 'It is a tie!';
}

If you moved this block to the bottom of the function you might see unexpected results.

 const determineWinner = (userChoice, computerChoice) => { if (userChoice === 'rock') { if (computerChoice === 'paper') { return 'The computer won;'; } else { return 'You won;'; } } if (userChoice === 'paper'){ if (computerChoice ==="scissors"){ return 'The computer won;'; } else { return 'you won:'; } } //found the match;., if (userChoice === 'scissors'){ if (computerChoice ==="rock"){ return 'The computer won!'; } else { //run else statement return 'you won!'; } } //it did not reach this point and returned before :( if(userChoice === computerChoice){ return 'It is a tie!'; //should be a tie } if (userChoice === 'bomb'){ return 'Bomb beats all'; } } console.log(determineWinner('scissors', 'scissors'))

I wanted to emphasise this behaviour so that you keep that in mind.

I hope it makes sense.

Answer 4

No it's not, that's what 4th IF statement handles. The way its structured means only two inputs are handled by each IF block. If the user putS in scissors then it would skip that IF block

Answer 5

I will try to explain it the best way I can. For this snippet of code:

if (userChoice === 'rock') {
  if (computerChoice === 'paper') {
    return 'The computer won!';
  } else {
    return 'You won!';
  }
}

The computer goes by the order of the statements. First, he checks what did the user pick (Which is rock in this snippet). if (userChoice === 'rock')

Then because the user indeed chose rock it will move to the next statement which is checking the computer's choice. If the computer chose paper (The correct counter to the rock) it will move to the return of the statement which is that the computer chose the counter and won

if (computerChoice === 'paper') {
    return 'The computer won!';

BUT, if the computer chose anything else other than paper then the if statement above is skipped and the else statement is executed which is the player won

  else {
    return 'You won!';
  }