Review DOM Manipulation by Building a Rock, Paper, Scissors Game - Step 3

Tell us what’s happening:

I have been stuck on this problem for a few nights now and am not entirely sure what I am doing wrong. I completely understand I can use the or operator to connect the “Computer wins!” functions, but I am trying to make sure I have some basic things down. I also have no clue how the userOption variable was generated, but I understand how computerResult is a thing. Do I have to declare that when a button is pressed, that is the userOption? JavaScript has been having me feeling very lost lately.

Your code so far

<!-- file: index.html -->

/* file: styles.css */

/* file: script.js */
// User Editable Region

function getRoundResults(userOption) {
 const computerResult = getRandomComputerResult();
 if (userOption===computerResult){
   return "It's a tie! Both chose ${userOption}";
 }
 else if (userOption === "Rock" && computerResult === "Scissors"){
  return "Player wins! ${userOption} beats ${computerResult}";
}
else if (userOption === "Scissors" && computerResult === "Paper"){
  return "Player wins! ${userOption} beats ${computerResult}";
}
else if(userOption === "Paper" && computerResult === "Rock"){
  return "Player wins! ${userOption} beats ${computerResult}";
}else{
  return "Computer wins! ${computerResult} beats ${userOption}";
}
}
console.log(getRoundResults("Rock"));
console.log("Player Score: ", playerScore, "Computer Score: ", computerScore);

// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Challenge Information:

Review DOM Manipulation by Building a Rock, Paper, Scissors Game - Step 3

oh dear! You’ve been stuck for too long! You should seek help much earlier to avoid getting frustrated.

Please read this part of the instructions:

  • Remember you can use the hasPlayerWonTheRound function to check if the player wins the round.

You don’t need to go to all the trouble you’ve gone to with all the if statements since hasPlayerWonTheRound already does everything you need to tell if the player won or not. (all the work you’re doing with userOption and computerResult is not needed)

I would reset the step and start again.

It was passed into the function here:

So userOption is the parameter that getRoundResults expects to get when it is called.
And we see that it gets it here:

Thanks for responding so quickly! I am trying so hard to figure these things out before I seek forum help so that I can get an good understanding of JavaScript, but yeah I probably should have sought help sooner.
Okay I think you helped me have an epiphany about the fundamentals of JavaScript functions. When you declare and define the function getRoundResults(userOption), you are at the same time declaring that the input variable name for that function is userOption. If that is not the case, then I will continue being confused but that is okay.
I updated my function…

function getRoundResults(userOption) {
  const computerResult = getRandomComputerResult();
 if (hasPlayerWonTheRound(true)){
   return "Player wins! ${userOption} beats ${computerResult}";
   playerScore++
 }
 else if(hasPlayerWonTheRound(false) && computerResult==userOption){
   return "It's a tie! Both chose ${userOption}";
 }else{
    return "Computer wins! ${computerResult} beats ${userOption}";
    computerScore++;
   }
}

I feel like another fundamental I am not grasping is how to check if the hasPlayerWonTheRound() function returns a false or true boolean value. That might be the thing coming between myself and success in this step, but still uncertain.
Thank you for your patience!

1 Like

Yes correct!

Go back up and read it. Is it returning a string? A number? An array? Or true and false?

Edit: also check if hasPlayerWonTheRound is expecting any arguments? What type?

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like

We are hopefully closing in on the solution here.
I have updated my function again:

function getRoundResults(userOption) {
  const computerResult = getRandomComputerResult();
 if (hasPlayerWonTheRound(player,computer)==true){
   return "Player wins! ${userOption} beats ${computerResult}";
   playerScore++;
 }
 else if(computerResult==userOption){
   return "It's a tie! Both chose ${userOption}";
 }else{
    return "Computer wins! ${computerResult} beats ${userOption}";
    computerScore++;
   }
}

I feel like I have to be close. At this point, I am a bit unsure about what I am misunderstanding. I believe I addressed your previous points/my previous questions about asking about which boolean value was returned by hasPlayerWonTheRound(). I am getting an error message Your getRoundResults should return a string, but I believe I have declared the return text appropriately. Unless I am missing some fundamental again. I have made sure by copying and pasting text when possible to ensure that I don’t carry over any typos.

1 Like

so yeah, hasPlayerWonTheRound returns a boolean (which you can easily check for as booleans are either true or false. )

however, though it seems you know that hasPlayerWonTheRound is expecting two parameters, you may not quite know what type of parameter it is expecting?

Please look again. What types of parameters should hasPlayerWonTheRound get?
What type are you passing?

Hint: hasPlayerWonTheRound is expecting the same type of parameter that getRoundResults is expecting…

I have tried

function getRoundResults(userOption) {
  const computerResult = getRandomComputerResult();
 if (hasPlayerWonTheRound(userOption,  computerResult)==true){
   return "Player wins! ${userOption} beats ${computerResult}";
   playerScore++;
 }
 else if(computerResult==userOption){
   return "It's a tie! Both chose ${userOption}";
 }else{
    return "Computer wins! ${computerResult} beats ${userOption}";
    computerScore++;
   }
}

This is kind of highlighting that I don’t understand why the previously-established variables/parameters player and computer were just seemingly dropped during the getRoundResults() function and replaced at this step with userOption and computerResult, respectively. I am also using “parameter” and “variable” somewhat interchangeably. I believe I understand a variable can be used as a parameter in regards to a function.

I understand that getRandomComputerResult() generates the "Rock","Paper", or "Scissors" result for the computer that is then used as the parameter for hasPlayerWonTheRound(). That seems straightforward at this point.

For the function hasPlayerWonTheRound(), I am 100% applying the logic you gifted to me earlier about a function being declared and defined as well as defining the names of the parameters that it will accept. So, I am assuming that the parameters this function will take, in order, are player and computer.

I also understand that the parameter computer should be the same as computerResult. userOption should equal player.userOption should pull from the button that is clicked by the user.

Is that what I’m missing? Am I supposed to declare that whatever button is clicked is both player AND userOption?

This is feeling like a lot to put in one question, is that’s the case :upside_down_face:

Your code looks quite good right now. But from a logical perspective, if you and I were playing this game, and we both held out the same hand (rock for for example), then do we need to bother asking who has won that round?
The only time we should ask is if we have different hands right? Like :facepunch:t4: or :scissors:, then we may wonder who has won?

If you agree, what could you change about your logic to do something like that? (We only need to check who has won if there is a difference between what the user and computer have played?)

Edit: also your return statements should use backticks and not double quotes.

Oh my gosh. First of all, yes I needed to use backticks as opposed to double quotes.
The code accepted when I used the === as opposed to == when comparing userOption and computerResult. Boy howdy. What a journey.

Thank you again so much for your patience and riding this out with me! It definitely helped in more ways than one.

2 Likes