Javascript阵列不会更新

我正在制作Javascript RPS Bot（岩石，纸张，剪刀机器人）。
除非当我试图在显示用户分数的代码中添加一个部分（如果他们在游戏输入框中键入“分数”或“所有分数”），否则一切都可以正常工作。
我一遍又一遍地查看了我的代码中的错误，甚至试图用http://jsfiddle.net/来调试它，但它告诉我没有错误。Javascript阵列不会更新

因此，这里是我的HTML：

<!DOCTYPE html> 
<html id="html"> 
    <body id="body"> 
    <div align="center" class="main"> 
     <input class="username" id="username" placeholder="Username"></input> 
     <input class="input" id="input" placeholder="Rock, Paper or Scissors" autofocus><!--game input box--></input> 
     <input type="button" class="button" value="Play" onClick="play()"></input> 
    </div> 

    <div class="result" id="result"> 
     <!--Game results go here--> 
    </div> 

    <center> 
    <input type="button" class="scheme" id="scheme" onClick="toggleScheme()" value="Scheme: Light"></input> 
    </center> 

    <script src="/jquery/1.11.1/jquery.min.js"></script> 
    <script> 
     //JQuery below goes here. 
    </script> 

    <script> 
     //Javascript below goes here 
    </script> 
    </body> 
</html>

我JQuery的只有文档中任何地方的“Enter”按键开始游戏的检查，但在这里它是以防万一：

$(document).keypress(function(e) { 
    if(e.which == 13) { 
    play(); 
    } 
});

而主要游戏的Javascript，这个问题很可能从这里开始：

var play = function() { 
//Ekatwikz RPS bot v1.0.3 
var randomINT = function (min, max) { 
    var random = Math.floor(Math.random() * (max - min)) + min; 
    if (random > max || random < min) { 
    random = "ERROR"; 
    } 
    return random; 
}; 

var capitalize = function (input) { 
    return input.charAt(0).toUpperCase() + input.substring(1); 
}; 

var reset = function() { 
    document.getElementById('input').value = ""; 
    document.getElementById('result').scrollTop = document.getElementById('result').scrollHeight; 
}; 

var getInput = document.getElementById('input').value.toLowerCase(); 
var username = document.getElementById('username').value; 
var getRandom = randomINT(1, 4); 
var output = ["", "", "", "", "", ""]; 

var scores = [0, 0, 0, 0, 0, 0]; 
/*^This^ is the scores array, scores[0] is the number of times the user has won, scores[1] is the number of times the user has lost, scores[2] is the number of draws for the user, scores[3] is the number of times the computer has won, scores[4] is the number of times the computer has lost, scores[5] is the number of draws for the computer*/ 
if (getInput === "" || getInput === null) { 
    getInput = "_Blank"; 
} 

if (username === "" || username === null) { 
    username = "user"; 
} 

if (getInput.substring(0, 5) == "clear" || getInput == "cls") { 
    document.getElementById('result').innerHTML = ""; 
    reset(); 
    return; 
} else if (getInput.substring(0, 2) == "my" || getInput.substring(0, 4) == "user") { 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Your total scores:"))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Wins: " + scores[0]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Losses: " + scores[1]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Draws: " + scores[2]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    reset(); 
    return; 
} else if (getInput.substring(0, 4) == "comp") { 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Computer's total scores:"))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Wins: " + scores[3]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Losses: " + scores[4]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Draws: " + scores[5]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    reset(); 
    return; 
} else if (getInput.substring(0, 3) == "all" || getInput.substring(0, 6) == "scores") { 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("All total scores:"))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Your wins: " + scores[0]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Your losses: " + scores[1]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Your draws: " + scores[2]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Computer's wins: " + scores[3]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Computer's losses: " + scores[4]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode("Computer's draws: " + scores[5]))); 
    document.getElementById("result").appendChild(document.createElement("BR")); 
    reset(); 
    return; 
} 

//Main game logic section 
if (getRandom == 1) { 
    //If computer picked rock 
    if (getInput == "rock") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Rock"; 
    output[1] = "Computer picked: Rock"; 
    output[2] = "*CLUNK SOUND*: Rocks smash against each other"; 
    output[3] = "DRAW"; 
    scores[2] = scores[2] + 1; 
    scores[5] = scores[5] + 1; 
    } else if (getInput == "paper") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Paper"; 
    output[1] = "Computer picked: Rock"; 
    output[2] = "Paper beats Rock"; 
    output[3] = capitalize(username) + " Wins"; 
    scores[0] = scores[0] + 1; 
    scores[4] = scores[4] + 1; 
    } else if (getInput == "scissors") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Scissors"; 
    output[1] = "Computer picked: Rock"; 
    output[2] = "Rock beats Scissors"; 
    output[3] = "Computer Wins"; 
    scores[1] = scores[1] + 1; 
    scores[3] = scores[3] + 1; 
    } else { 
    output[5] = "NO"; 
    output[4] = 'ERROR: Computer does not understand what "' + getInput + '" is.'; 
    } 
} else if (getRandom == 2) { 
    //If computer picked paper 
    if (getInput == "rock") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Rock"; 
    output[1] = "Computer picked: Paper"; 
    output[2] = "Paper beats Rock"; 
    output[3] = "Computer Wins"; 
    scores[1] = scores[1] + 1; 
    scores[3] = scores[3] + 1; 
    } else if (getInput == "paper") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Paper"; 
    output[1] = "Computer picked: Paper"; 
    output[2] = "*SWISH SOUND* Papers brush against each other"; 
    output[3] = "DRAW"; 
    scores[2] = scores[2] + 1; 
    scores[5] = scores[5] + 1; 
    } else if (getInput == "scissors") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Scissors"; 
    output[1] = "Computer picked: Paper"; 
    output[2] = "Scissors beats Paper"; 
    output[3] = capitalize(username) + " Wins"; 
    scores[0] = scores[0] + 1; 
    scores[4] = scores[4] + 1; 
    } else { 
    output[5] = "NO"; 
    output[4] = 'ERROR: Computer does not understand what "' + getInput + '" is.'; 
    } 
} else if (getRandom == 3) { 
    //If computer picked scissors 
    if (getInput == "rock") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Rock"; 
    output[1] = "Computer picked: Scissors"; 
    output[2] = "Rock beats Scissors"; 
    output[3] = capitalize(username) + " Wins"; 
    scores[0] = scores[0] + 1; 
    scores[4] = scores[4] + 1; 
    } else if (getInput == "paper") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Paper"; 
    output[1] = "Computer picked: Scissors"; 
    output[2] = "Scissors beats Paper"; 
    output[3] = "Computer Wins"; 
    scores[1] = scores[1] + 1; 
    scores[3] = scores[3] + 1; 
    } else if (getInput == "scissors") { 
    output[5] = "YES"; 
    output[0] = capitalize(username) + " picked: Scissors"; 
    output[1] = "Computer picked: Scissors"; 
    output[2] = "*CLINK SOUND*: Scissors hit each other"; 
    output[3] = "DRAW"; 
    scores[2] = scores[2] + 1; 
    scores[5] = scores[5] + 1; 
    } else { 
    output[5] = "NO"; 
    output[4] = 'ERROR: Computer does not understand what "' + getInput + '" is.'; 
    } 
} else { 
    output[5] = "NO"; 
    output[4] = "ERROR: Randomizer function seems to be broken"; 
} 

var finish = function (input) { 
    if (input === undefined) { 
    if (output[5] == "YES") { 
     document.getElementById("result").appendChild(document.createElement("BR")); 
     document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode(output[0]))); 
     document.getElementById("result").appendChild(document.createElement("BR")); 
     document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode(output[1]))); 
     document.getElementById("result").appendChild(document.createElement("BR")); 
     document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode(output[2]))); 
     document.getElementById("result").appendChild(document.createElement("BR")); 
     document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode(output[3]))); 
     document.getElementById("result").appendChild(document.createElement("BR")); 
    } else { 
     document.getElementById("result").appendChild(document.createElement("BR")); 
     document.getElementById("result").appendChild(document.createElement("SPAN").appendChild(document.createTextNode(output[4]))); 
     document.getElementById("result").appendChild(document.createElement("BR")); 
    } 
    } 
}; 

finish(); 
reset(); 
};

我apol提前ogize为乱码。

来源

2014-09-01 Ekatwikz

您可能想要查看可用的各种JavaScript模板引擎之一。它会让你的代码更清晰。 – Pointy 2014-09-01 14:01:35

请链接到您的jsfiddle ...并且...更好地使用对象 – 2014-09-01 14:01:44

如果您使用的是对象而不是数组，例如，您的代码将更易于阅读和维护。 'scores.wins'，'scores.losses'等 – Barmar 2014-09-01 14:04:18

问题是scores是play函数中的局部变量，因此每次用户启动另一个游戏时都会重新初始化该函数。它需要是一个全局变量，在函数之外，所以它的值从一个调用继续到另一个调用。

var scores = [0,0,0,0,0,0]; 
var play = function() { 
    ... 
}

那将是更好地使一个对象：

var scores = { 
    humanWin: 0, 
    humanLose: 0, 
    draw: 0 
};

我不明白为什么你需要的计算机胜，损失额外的元素，并绘制;赢得的电脑数量总是与人类损失相同，反之亦然，并且他们都有相同的抽奖数量。

来源

2014-09-01 14:11:13 Barmar

哇，所以这是问题... 现在我觉得完全像一些盲目的noob。无论如何，谢谢！ XD – Ekatwikz 2014-09-01 14:27:11

Javascript阵列不会更新

回答

相关问题