Rock paper scissors and ropoe 9/9


#1

problem with my code below
1. it will prompt the alert ("Please only enter rock, paper, scissors!") even if enter the right word
2. if it is tie, the computerChoice doesn't generate the new radon choice.

How to resolve these two problems, any better suggetsion, thanks!

var userChoice = prompt("Do you choose rock, paper or scissors?");
// ask to enter only propriate words and with no blank;
if(userChoice ===""){
alert("You need to enter your choice!");
userChoice = prompt("Do you choose rock, paper or scissors?");
}else if (userChoice!=="rock" || "ROCK" || "Rock" || "paper" || "PAPER" || "Paper" || "scissors" || "SCISSORS" || "Scissors" || "rope" || "ROPE" || "Rope"){
alert("Please only enter rock, paper, scissors!");
userChoice = prompt("Do you choose rock, paper, scissors or rope?");
}
// end of instruction 1

var computerChoice = Math.random();
if (computerChoice < 0.34) {
computerChoice = "rock";
} else if(computerChoice <= 0.67) {
computerChoice = "paper";
} else {
computerChoice = "scissors";
}

console.log("Computer: " + computerChoice);

// add rope with rock paper scissors
var compare = function (choice1, choice2) {
if (choice1 === choice2){
alert("The result is tie!, make a new game again please");
userChoice = prompt("Do you choose rock, paper or scissors?");
console.log("Computer: " + computerChoice);
console.log("User: " + userChoice);
//compare(userChoice, computerChoice);

}else if(choice1 === "rock"){
    if (choice2 ==="scissors"){
        return "rock wins";
    }else if(choice2 ==="paper"){
        return "paper wins"
    }else{
        return "rope wins";
    }
}else if(choice1 === "paper") {
    if(choice2 === "rock"){
        return "paper wins";
    }else if(choice2 === "scissors"){
        return "scissors wins";
    }else{
        return "rope wins";
    }

}else if(choice1 ==="scissors"){
    if(choice2 ==="rock"){
        return "rock wins";
    }else if(choice2 =="scissor"){
        return "scissors wins";
    }else{
        return "rope wins";
    }
}

};
// end of instruction 2

console.log("User: " + userChoice);
compare(userChoice, computerChoice);


#2

The compare function has only 1 purpose
given a userChoice and a computerChoice it will return a string Value
which you can capture into a variable theResult
like

 var theResult = compare(userChoice,computerChoice);
 console.log( theResult );
 if ( theResult === 'scissors wins' ) {
       //IF code-block
 }

1 To extend the userChoice-prompting with a validity-check, you would
embed the prompting into a function-body...
So you would start by
var getUserChoice = function() { your prompting here };

2 If you are extending the choice-possibillity, you have to extend the
so-called truth-table.

Your new Decisions-Table: fill-in ?? wins...

              | ch-2  |  ch-2  | ch-2     | ch-2   |
              | rock  |  paper | scissors | rope   |
  ------------|-------|--------|----------|--------|
              |       | paper  |  rock    | ????   |
 choice1  rock|   X   | wins   |  wins    |  wins  | (1st else if )
              |       |        |          |        |
  ------------|-------|--------|----------|--------|
              | paper |        |scissors  |  ? ?   |
 choice1 paper| wins  |    X   |  wins    |  wins  | (2nd else if )
              |       |        |          |        |
  ------------|-------|--------|----------|--------|
              |  rock |scissors|          |  ?  ?  | 
 ch-1 scissors|  wins | wins   |   X      |  wins  | (3rd else if )
              |       |        |          |        |
  ------------|-------|--------|----------|--------|
              |  ? ?  | ? ? ?  |  ? ? ?   |        | 
 ch-1 rope    |  wins | wins   |   wins   |    X   | (4th else if )
              |       |        |          |        |
  ------------|-------|--------|----------|--------|

3 What you want is a loop-construct...
create the getUserChoice function using return-statement
create the getComputerChoice function using return-statement
creat the compare function using return-statement

As you are using return-statements you call the compare-function
var theResult = compare(userChoice,computerChoice);
and thus having the =result= of the game in the theResult variable

===========================================

var playTheGame =function() {
    var playAgain =true;
    var userChoice="";
    var computerChoice="";
    var theResult="";

   while (playAgain) {

       //execute the pre-declared getUserChoice-function
       var userChoice = getUserChoice();
       console.log("User choice is " + userChoice);

        //execute the pre-declared getComputerChoice-function
        var computerChoice = getComputerChoice();
        console.log("Computer choice is " + computerChoice);

        //execute the compare-function and capture the-result
        theResult = compare(userChoice,computerChoice);
        console.log("The result is " + theResult);

    if (theResult === "It is a tie!") {
       playAgain = true;
    } else {
      playAgain = false;
    }

    //end of -while- loop is reached, and if VALUE of playAgain === true
    // the loop will start over
    } //closing the while-loop
 }; //closing the function-body of playTheGame

// call the function playTheGame
playTheGame();

#3

Thank you very much! :clap:


#4

Also this will not work. I get what you try to say:

if userChoice is not equal to "rock" or "Rock" or ROCK" ...
The problem is that the interpreter doesn't know this kind of abbreviation. Meaning for the computer it is read as:

Condition1: userChoice!=="rock" 
Condition2: "rock"
...

By now it should already be obvious that "rock" is not a condition but a value and when you dig deeper you find out that values are treated as booleans when used in conditions:
http://www.sitepoint.com/javascript-truthy-falsy/
So as "rock" is an non-empty string it is treated as true and as in an or chain only one needs to be true to make the whole statement true this condition will always be true no matter what userChoice actually is. So I guess you need to go the long way:

if(userChoice!=="rock" || userChoice!=="ROCK" || ...

Also as a hint this might be shortend using .toUpperCase() or .toLowerCase().


#5

Thx for the details and the hint, great learning from the explainastion.

No programming background, so its really helpful to know why and how. Thx again.