if else statement failing in a paper-rock-scissors challenge - javascript

I'm a complete beginner in Javascript and coding in general.
I'm trying to make a simple command-line javascript paper-rock-scissors game but I keep getting a bug. I've created a function for the computer to randomly pick paper, rock or scissors and getting the user's selection from a prompt. To get the result I've written an if else statement that will show an alert with the outcome but regardless the input it always shows a tie. It seems that the code always ends up on the else part of the statement and I can't figure out why. Can someone help me with what's wrong with the statement and why it skips to else?
function computerPlay() {
let computerChoices = ["paper", "rock", "scissors"];
let computerChoice = computerChoices[Math.floor(Math.random() * computerChoices.length)];
return computerChoice;
}
function playRound(computerSelection, playerSelection) {
if (computerSelection === "rock" && playerSelection.toLowerCase() === "paper") {
alert("You win, paper beats rock!")
} else if (computerSelection === "paper" && playerSelection.toLowerCase() === "scissors") {
alert("You win, scissors beat paper!")
} else if (computerSelection === "scissors" && playerSelection.toLowerCase() === "rock") {
alert("You win, rock beat scissors")
} else if (computerSelection === "rock" && playerSelection.toLowerCase() === "scissors") {
alert("You loose, rock beats scissors")
} else if (computerSelection === "paper" && playerSelection.toLowerCase() === "rock") {
alert("You loose, paper beats rock")
} else if (computerSelection === "scissors" && playerSelection.toLowerCase() === "paper") {
alert("You loose, scissors beats paper")
} else {
alert("even steven")
}
}
for (let i = 1; i <= 5; i++) {
computerPlay()
const playerSelection = prompt("Please enter your choice", " ");
const computerSelection = computerPlay();
console.log(computerSelection);
console.log(playerSelection);
playRound(computerSelection, playerSelection);
}

Remove " " from the prompt, it's adding an unnnecessary white space causing issues in your if statements
function computerPlay() {
let computerChoices = ["paper", "rock", "scissors"];
let computerChoice = computerChoices[Math.floor(Math.random() * computerChoices.length)];
return computerChoice;
}
function playRound(computerSelection, playerSelection) {
if (computerSelection === "rock" && playerSelection.toLowerCase() === "paper") {
alert("You win, paper beats rock!")
} else if (computerSelection === "paper" && playerSelection.toLowerCase() === "scissors") {
alert("You win, scissors beat paper!")
} else if (computerSelection === "scissors" && playerSelection.toLowerCase() === "rock") {
alert("You win, rock beat scissors")
} else if (computerSelection === "rock" && playerSelection.toLowerCase() === "scissors") {
alert("You loose, rock beats scissors")
} else if (computerSelection === "paper" && playerSelection.toLowerCase() === "rock") {
alert("You loose, paper beats rock")
} else if (computerSelection === "scissors" && playerSelection.toLowerCase() === "paper") {
alert("You loose, scissors beats paper")
} else {
alert("even steven")
}
}
for (let i = 1; i <= 5; i++) {
computerPlay()
const playerSelection = prompt("Please enter your choice");
const computerSelection = computerPlay();
console.log(computerSelection);
console.log(playerSelection);
playRound(computerSelection, playerSelection);
}

Related

JavaScript Rock Paper Scissors console game Errors

Beginner JavaScript console Rock Paper Scissors project.
For some reason the only outcome I am getting is "Error. Only enter Rock, Paper, or Scissors." I don't know I'm just stumped. I am also a complete beginner.
Before this error I had it half working, now its just broken. Any help would be nice.
const playerSelection = prompt('Rock, Paper, Scissors?').toLowerCase();
const randomInt = Math.floor(Math.random() * 3);
const computerSelection = computerPlay();
function caseInsensitive(playerSelection) {
return playerSelection.charAt(0).toUpperCase() + playerSelection.slice(1);
}
console.log(caseInsensitive(playerSelection))
function computerPlay() {
if (randomInt === 0) {
return 'Rock';
} else if (randomInt === 1) {
return 'Paper';
} else {
return 'Scissors'
}
}
console.log(computerPlay())
function playRound(playerSelection, computerSelection) {
if (playerSelection == 'Rock' && computerSelection == 'Scissors') {
return (`You win! ${playerSelection} beats ${computerSelection}`)
} else if (playerSelection == 'Paper' && computerSelection == 'Rock') {
return (`You win! ${playerSelection} beats ${computerSelection}`)
} else if (playerSelection == 'Scissors' && computerSelection == 'Paper') {
return (`You win! ${playerSelection} beats ${computerSelection}`)
} else if (playerSelection == 'Scissors' && computerSelection == 'Rock') {
return (`You lose! ${computerSelection} beats ${playerSelection}`)
} else if (playerSelection == 'Rock' && computerSelection == 'Paper') {
return (`You lose! ${computerSelection} beats ${playerSelection}`)
} else if (playerSelection == 'Paper' && computerSelection == 'Scissors') {
return (`You lose! ${computerSelection} beats ${playerSelection}`)
} else if (playerSelection == computerSelection) {
return (`It's a tie, Refresh to play again!`)
} else {
return (`Error. Only enter Rock, Paper, or Scissors`)
}
}
console.log(playRound(playerSelection, computerSelection));

Rock Paper Scissors Javascript (The Odin Project)

Hello everyone this is my first question here so sorry if it doesn't match all the rules. I am trying to make a rock paper scissors game from the Odin Project in javascript, and I'm having problem with the result output because it doesn't display what it should. If computer plays rock for e. and i play rock i should get it's a draw but i get something random all the time. Current code is with prompt() for user input, but I tried putting a fixed string like "paper" and it was the same, I also thought it was because I didn't put toLowerCase() properly so I removed it completely and it's still the same, I would appreciate your help!
function computerPlay() {
let rps = ["rock", "paper", "scissors"];
let random = rps[Math.floor(Math.random() * rps.length)];
return random;
}
console.log(computerPlay());
function playRound(playerSelection, computerSelection) {
if (playerSelection === computerSelection) {
return ("It's a draw!");
} else if ((playerSelection === "rock") && (computerSelection === "scissors")) {
return ("You win! Rock beats scissors");
} else if (playerSelection === "rock" && computerSelection === "paper") {
return ("You lose! Paper beats rock");
} else if (playerSelection === "paper" && computerSelection === "rock") {
return ("You win! Paper beats rock");
} else if (playerSelection === "paper" && computerSelection === "scissors") {
return ("You lose! Scissors beat paper");
} else if (playerSelection === "scissors" && computerSelection === "paper") {
return ("You win! Scissors beat paper");
} else if (playerSelection === "scissors" && computerSelection === "rock") {
return ("You lose!Rock beats scissors");
}
}
let computerSelection = computerPlay();
let playerSelection = prompt("Choose your weapon");
console.log(playRound(playerSelection, computerSelection));
You first console.log the function computerPlay() and that returns a certain value. After that you play the round and calls again the function computerPlay(), this computes the round with another value than you first console.log.
Try this code below
function computerPlay() {
let rps = ["rock", "paper", "scissors"];
let random = rps[Math.floor(Math.random() * rps.length)];
return random;
}
function playRound(playerSelection, computerSelection) {
if (playerSelection === computerSelection) {
return ("It's a draw!");
} else if ((playerSelection === "rock") && (computerSelection === "scissors")) {
return ("You win! Rock beats scissors");
} else if (playerSelection === "rock" && computerSelection === "paper") {
return ("You lose! Paper beats rock");
} else if (playerSelection === "paper" && computerSelection === "rock") {
return ("You win! Paper beats rock");
} else if (playerSelection === "paper" && computerSelection === "scissors") {
return ("You lose! Scissors beat paper");
} else if (playerSelection === "scissors" && computerSelection === "paper") {
return ("You win! Scissors beat paper");
} else if (playerSelection === "scissors" && computerSelection === "rock") {
return ("You lose!Rock beats scissors");
}
}
let computerSelection = computerPlay();
let playerSelection = prompt("Choose your weapon");
console.log(computerSelection)
console.log(playRound(playerSelection, computerSelection));
You can simplify your conditions in this way
const choices = ["Rock", "Paper", "Scissors"]
const computerPlay = () => choices[Math.floor(Math.random() * choices.length)]
function playRound(playerSelection, computerSelection) {
const difference = (choices.length + choices.indexOf(playerSelection) - choices.indexOf(computerSelection) )% choices.length
switch(difference){
case 0:
return "It's a draw!"
case 2:
return `You lose! ${computerSelection} beats ${playerSelection}`
default:
return `You win! ${playerSelection} beats ${computerSelection}`
}
}
let computerSelection = computerPlay();
let playerSelection
while(!choices.includes(playerSelection)){
const selected = prompt("Choose your weapon").trim().toLowerCase();
playerSelection = selected[0].toUpperCase()+selected.slice(1)
}
console.log(playRound(playerSelection, computerSelection));

Can anyone tell me why my code doesn't work properly? Game ROCK, PAPER, SCISSORS. Java Script

Can anyone tell me why my code doesn't work properly? I'm trying to make game ROCK, PAPER, SCISSORS on plain Java Script. For some reason it doesn't work as I expect.
const computerAanswer = ["rock", "paper", "scissors"];
function computerPlay() {
let answer = computerAanswer[Math.floor(Math.random() * computerAanswer.length)];
return answer;
}
console.log('computer choice is: ' + computerPlay().toUpperCase());
function playRound (playerSelection, computerSelection) {
playerSelection = playerSelection.toLowerCase()
if (playerSelection == "rock" && computerSelection == "scissors") {
return "Congrats,you are winner!";
} else if (playerSelection == "paper" && computerSelection == "rock") {
return "Congrats,you are winner!";
} else if (playerSelection == "scissors" && computerSelection == "paper") {
return "Congrats,you are winner!";
} else if (playerSelection == "rock" && computerSelection == "rock") {
return "Draw!";
} else if (playerSelection == "paper" && computerSelection == "paper") {
return "Draw!";
} else if (playerSelection == "scissors" && computerSelection == "scissors") {
return "Draw!";
} else {
return "You lose. Maybe next time...";
}
}
let playerSelection = prompt("Make your choose: Rock, Paper or Scissors?");
let computerSelection = computerPlay();
console.log(playRound(playerSelection, computerSelection));
console.log('player choice is: ' + playerSelection.toUpperCase());
I guess that's just your first console.log :
console.log('computer choice is: ' + computerPlay().toUpperCase());
It plays a round for computer, then you play another one against prompted user.
Do that instead :
function computerPlay() {
let answer = computerAanswer[Math.floor(Math.random() * computerAanswer.length)];
console.log('computer choice is: ' + answer.toUpperCase());
return answer;
}
When I nested
console.log('computer choice is: ' + answer.toUpperCase());
into computerPlay function it works.
const computerAanswer = ["rock", "paper", "scissors"];
function computerPlay() {
let answer = computerAanswer[Math.floor(Math.random() * computerAanswer.length)];
console.log('computer choice is: ' + answer.toUpperCase());
return answer;
}
function playRound (playerSelection, computerSelection) {
playerSelection = playerSelection.toLowerCase()
if (playerSelection == "rock" && computerSelection == "scissors") {
return "Congrats,you are winner!";
} else if (playerSelection == "paper" && computerSelection == "rock") {
return "Congrats,you are winner!";
} else if (playerSelection == "scissors" && computerSelection == "paper") {
return "Congrats,you are winner!";
} else if (playerSelection == "rock" && computerSelection == "rock") {
return "Draw!";
} else if (playerSelection == "paper" && computerSelection == "paper") {
return "Draw!";
} else if (playerSelection == "scissors" && computerSelection == "scissors") {
return "Draw!";
} else {
return "You lose. Maybe next time...";
}
}
let playerSelection = prompt("Make your choose: Rock, Paper or Scissors?");
let computerSelection = computerPlay();
console.log(playRound(playerSelection, computerSelection));
console.log('player choice is: ' + playerSelection.toUpperCase());

Changing the value of a variable with DOM element click

Im trying to allow the player to click the Rock paper or scissors button and that changes the value of the 'playerChoice' variable so so the playRound function can be called with their choice but it doesnt seem to work and im not sure what im doing wrong
Code
// Rock paper scissors game
let rockBtn = document.querySelector('.Rock');
let paperBtn = document.querySelector('.Paper');
let scissorBtn = document.querySelector('.Scissors');
function computerPlay() {
let rps = ["Rock", "Paper", "Scissors"];
let computerChoice = rps[Math.floor(Math.random()*rps.length)];
return computerChoice;
}
function playRound(playerSelection, computerSelection) {
if (playerSelection == "Rock" && computerSelection == "Rock") {
console.log('Its a Draw');
} else if (playerSelection == "Rock" && computerSelection == "Scissors") {
console.log("Player wins");
} else if(playerSelection == "Rock" && computerSelection == "Paper") {
console.log("Computer wins");
} else if(playerSelection == "Paper" && computerSelection == "Paper") {
console.log("Its a draw");
} else if(playerSelection == "Paper" && computerSelection == "Scissors") {
console.log("Computer wins");
} else if(playerSelection == "Paper" && computerSelection == "Rock") {
console.log("Player wins");
} else if(playerSelection == "Scissors" && computerSelection == "Scissors") {
console.log("Its a draw");
} else if(playerSelection == "Scissors" && computerSelection == "Paper") {
console.log("Player wins ");
} else if(playerSelection == "Scissors" && computerSelection == "Rock") {
console.log("Computer wins");
}
}
function game() {
const computerChoice = computerPlay();
var playerChoice = "";
rockBtn.addEventListener('click' , function() {
playerChoice = "Rock";
});
paperBtn.addEventListener('click' , function() {
playerChoice = "Paper";
console.log(playerChoice);
});
scissorBtn.addEventListener('click' , function() {
playerChoice = "Scissors";
});
console.log("Player choice is" + playerChoice);
console.log('Computer choice is' + computerChoice);
playRound(playerChoice, computerChoice);
}
game();
Is this the correct way to do this is there a better way?
You should call playRound method inside the click listeners.
// Rock paper scissors game
let rockBtn = document.querySelector('.Rock');
let paperBtn = document.querySelector('.Paper');
let scissorBtn = document.querySelector('.Scissors');
var playerChoice = "";
function computerPlay() {
let rps = ["Rock", "Paper", "Scissors"];
let computerChoice = rps[Math.floor(Math.random()*rps.length)];
return computerChoice;
}
function playRound(playerSelection, computerSelection) {
if (playerSelection == "Rock" && computerSelection == "Rock") {
console.log('Its a Draw');
} else if (playerSelection == "Rock" && computerSelection == "Scissors") {
console.log("Player wins");
} else if(playerSelection == "Rock" && computerSelection == "Paper") {
console.log("Computer wins");
} else if(playerSelection == "Paper" && computerSelection == "Paper") {
console.log("Its a draw");
} else if(playerSelection == "Paper" && computerSelection == "Scissors") {
console.log("Computer wins");
} else if(playerSelection == "Paper" && computerSelection == "Rock") {
console.log("Player wins");
} else if(playerSelection == "Scissors" && computerSelection == "Scissors") {
console.log("Its a draw");
} else if(playerSelection == "Scissors" && computerSelection == "Paper") {
console.log("Player wins ");
} else if(playerSelection == "Scissors" && computerSelection == "Rock") {
console.log("Computer wins");
}
playerChoice = "";
}
rockBtn.addEventListener('click' , function() {
playerChoice = "Rock";
playRound(playerChoice, computerPlay());
});
paperBtn.addEventListener('click' , function() {
playerChoice = "Paper";
playRound(playerChoice, computerPlay());
});
scissorBtn.addEventListener('click' , function() {
playerChoice = "Scissors";
playRound(playerChoice, computerPlay());
});

type error toLowercase is not a function

I am starting out learning javascript. I have a task where I must create a simple rock, paper scissors game against the computer.
The program will eventually prompt the human to type either rock, paper or scissors when it is their turn. To ensure data validation the program must decapitalize any letters inputted by the human.
To do this I am trying to use the toLowercase function which can be seen in the second line of code below.
In return of my efforts i am receiving the following in the console:
TypeError: playerSelection.toLowercase is not a function
function playRound(playerSelection, computerSelection) {
playerSelection = playerSelection.toLowercase();
var resultMessage = "";
if (playerSelection == "rock" && computerSelection == "paper") {
resultMessage = "You Lose. Paper beats Rock";
}
else if (playerSelection == "rock" && computerSelection == "scissors") {
resultMessage = "You Win. Rock beats Scissors";
}
else if (playerSelection == "paper" && computerSelection == "scissors") {
resultMessage = "You Lose. Scissors beats Paper";
}
else if (playerSelection == "paper" && computerSelection == "rock") {
resultMessage = "You Win. Paper beats Rock";
}
else if (playerSelection == "scissors" && computerSelection == "paper") {
resultMessage = "You Win. Scissors beats Paper";
}
else if (playerSelection == "scissors" && computerSelection == "rock") {
resultMessage = "You Win. Scissors beats Rock";
}
else {
resultMessage = "Draw";
}
return resultMessage;
}
console.log(playRound("rock",compPlay));
It is not, toLowerCase() is. (Case not case, more at Camel case).

Categories

Resources