Fernando Souza Fernando Souza -4 years ago 95
Javascript Question

How to store 3 different results within the same function

I`m working on a rock/paper/scissors game using javascript, the player will play 3 times, and the results of each time will be displayed on screen.Every play is stored in a different function that returns a value. The final result will be given according to the sum of those 3 values.

I am having problems to figure out the logic to play those 3 times in the same button.

After I pressed a button and play by the first time, how can I press it again, but play a second function? Should I use only 1 function but how could I store 3 different results?



function playGame(choice) {


confirm('Are you sure?');
document.getElementById("userChoice1").style.backgroundImage = "url('./img/rock2.png')";
document.getElementById("userChoice2").style.backgroundImage = "url('./img/scissors2.png')";
document.getElementById("userChoice3").style.backgroundImage = "url('./img/paper2.png')";

if(choice == 'A')
{
var userChoice = "rock";
/* animation */
document.getElementById("userChoiceDis").style.backgroundImage = "url('./img/rock.png')";
}
else if(choice == 'B')
{
var userChoice = "scissors";
/* animation */
document.getElementById("userChoiceDis").style.backgroundImage = "url('./img/scissors.png')";
} else if (choice == 'C'){
var userChoice = "paper";
/* animation */
document.getElementById("userChoiceDis").style.backgroundImage = "url('./img/paper.png')";
}

var computerChoice = Math.random();
if (computerChoice < 0.34) {
computerChoice = "rock";
/* animation */
document.getElementById("aiChoiceDis").style.backgroundImage = "url('./img/rock.png')";
} else if(computerChoice <= 0.67) {
computerChoice = "paper";
/* animation */
document.getElementById("aiChoiceDis").style.backgroundImage = "url('./img/paper.png')";
} else {
computerChoice = "scissors";
/* animation */
document.getElementById("aiChoiceDis").style.backgroundImage = "url('./img/scissors.png')";
}

var compare1 = function(choice1, choice2) {

if(choice1 === choice2) {
document.getElementById("result").style.backgroundImage = "url('./img/tie.png')";
var pResult = "tie";
document.getElementById("replay").style.display = "block";

}else if(choice1 ==="rock")
{
if(choice2 === "scissors")
{
/* animation */

document.getElementById("result").style.backgroundImage = "url('./img/win.png')";

/* animation */
document.getElementById("replay").style.display = "block";
var pResult = true;

}else
{
/* animation */
document.getElementById("result").style.backgroundImage = "url('./img/loose.png')";

/* animation */
document.getElementById("replay").style.display = "block";
var pResult = false;
}
}else if(choice1 ==="paper")
{
if(choice2 === "rock")
{
/* animation */
document.getElementById("result").style.backgroundImage = "url('./img/win.png')";
var pResult = true;
/* animation */
document.getElementById("replay").style.display = "block";
}else
{
/* animation */
document.getElementById("result").style.backgroundImage = "url('./img/loose.png')";
var pResult = false;
/* animation */
document.getElementById("replay").style.display = "block";
}
}else if(choice1 ==="scissors")
{
if(choice2 === "rock")
{
/* animation */
document.getElementById("result").style.backgroundImage = "url('./img/loose.png')";
var pResult = false;
/* animation */
document.getElementById("replay").style.display = "block";

}else
{
/* animation */
document.getElementById("result").style.backgroundImage = "url('./img/win.png')";
var pResult = true;
/* animation */
document.getElementById("replay").style.display = "block";
}
}else
{
return "incorrect input";
}

switch(pResult) {
case true:
document.getElementById("gameResult1").style.backgroundImage = "url('./img/win.png')";
break;
case "tie":
document.getElementById("gameResult1").style.backgroundImage = "url('./img/win.png')";
break;
default:
document.getElementById("gameResult1").style.backgroundImage = "url('./img/loose.png')";

}

};
compare1(userChoice,computerChoice);





Answer Source

Use an array - Each time use something like:

var allResults = []; //declare the array
allResults.push(results);

Then you will have a nice array of all the results. You can inspect the contents of the array with console.log(allResults). To access the individual results, use an index number, for example allResults[0] will return the first value in the array.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download