在javascript函数中返回正确值的问题

Question

我想要做的是在一个页面内模拟一个简单的纸，岩石，剪刀游戏，其中一个玩家用单选按钮选择r / p / s，提交他的选择，玩家2也做同样的事情。

我毫不怀疑这段代码存在多个问题，但每当我尝试运行解析摇滚/纸/剪刀的功能时，我都会看到非常奇怪的东西。 我总是得到一个真实的：

else if (player1Choice("Rock") && player2Choice("Scissors")) {
        $("resultOutput").value = "Player 1s Rock beats Player 2s Scissors";
    }

我每次都得到这个结果。 我已经盯着这个功能这么长时间，我可能只是对这个明显的分辨率视而不见了。

// create our $() shortcut function for easily retrieving elements by id
var $ = function(id) {
    return document.getElementById(id);
}

//function executed on page load
window.onload = function() {

    //clear any previous values
    document.forms[0].reset();

    //store value from player1Weapon radio choice with the player1Choice function
    $("player1Submit").onclick = player1Choice;

    //store value from player1Weapon radio choice with the player2Choice function
    $("player2Submit").onclick = player2Choice;

    //assign the fight button to run the fightCrunch function to determine the winner
    $("fight").onclick = fightCrunch;
}

var player1Choice = function(x){
    var a = "Paper";
    var b = "Rock";
    var c = "Scissors";
   //the html has several radio buttons with id's of "player1Paper", etc. the $ function is to get the id name, and then I'm doing if, else ifs to see which on is checked.
    if ($("player1Paper").checked) {
        return a;
}
else if ($("player1Rock").checked) {
    return b;
}
else if ($("player1Scissors").checked) {
    return c;
}
else {
    alert("Player 1, you need to pick a crude instrument of violence first");
}
};

var player2Choice = function(y){
    var d = "Paper";
    var e = "Rock";
    var f = "Scissors";
    //var d = $("player2Paper").value;
    //var e = $("player2Rock").value;
    //var f = $("player2Scissors").value;
    if ($("player2Paper").checked) {
        return d;
}
else if ($("player2Rock").checked) {
    return e;
}
else if ($("player2Scissors").checked) {
    return f;
}
else {
    alert("Player 2, you need to pick a crude instrument of violence first");
}
};

var fightCrunch = function(){
        //The next few lines are commented out because the if gets hung up on this part, this always comes back as true no matter what I do with the previous functions.
    //if (player1Choice || player2Choice == undefined) {
        //alert("Both players need to select and submit a weapon of choice before a winner is determined");
    //}
    if (player1Choice && player2Choice == "Rock") {
        $("resultOutput").value = "Both players chose Rock, which results in a stalemate";
    }
    else if (player1Choice && player2Choice == "Paper") {
        $("resultOutput").value = "Both players chose Paper, which results in a stalemate";
    }
    else if (player1Choice && player2Choice == "Scissors") {
        $("resultOutput").value = "Both players chose Scissors, which results in a stalemate";
    }
    else if (player1Choice("Rock") && player2Choice("Scissors")) {
        $("resultOutput").value = "Player 1s Rock beats Player 2s Scissors";
    }
    else if (player1Choice("Rock") && player2Choice("Paper")) {
        $("resultOutput").value = "Player 2s Paper beats Player 1s Rock";
    }
    else if (player1Choice("Paper") && player2Choice("Rock")) {
        $("resultOutput").value = "Player 1s Paper beats Player 2s Rock";
    }
    else if (player1Choice("Paper") && player2Choice("Scissors")) {
        $("resultOutput").value = "Player 2s Scissors beats Player 1s Paper";
    }
    else if (player2Choice("Paper").value && player1Choice("Scissors")) {
        $("resultOutput").value = "Player 1s Scissors beats Player 2s Paper";
    }
    else if (player2Choice("Rock").value && player1Choice("Scissors")) {
        $("resultOutput").value = "Player 2s Rock beats Player 1s Scissors";
    }
    else {
        alert("something is wrong here");
    }
}

Answer 1

你的代码有很多问题。 但是你问的问题源于你做比较的方式。

你不可以做这个：

if (player1Choice && player2Choice == "Rock")

这意味着什么：

if ((player1Choice == true) && (player2Choice == "Rock"))

相反，你想以这种方式编写它（但由于许多其他错误，它仍然无法工作）：

if (player1Choice == player2Choice) {
    $("resultOutput").value = "Both players chose " + player1Choice + ", which results in a stalemate";
}

您不仅可以减少比较操作，还可以保存许多代码行！

请注意，在最近2次错误添加“.value”的比较中，您有其他拼写错误。

最重要的是，您可能需要注意， player1Choice和player2Choice函数不是变量。 您已指定它们是单击事件的事件处理程序。 它们返回的值不会在哪里，也不会被fightcrunch函数接收。

我真的不想破坏你制作这个程序的乐趣，但如果你放弃了，你可以在这里看到更正和功能更强的代码（如果你不想看到它，它会在右边标签）：

                                                                                <form>
                                                                                    Player 1
                                                                                    <select id="player1">
                                                                                        <option value="0" selected>Paper</option>
                                                                                        <option value="1">Rock</option>
                                                                                        <option value="2">Scissors</option>
                                                                                    </select>

                                                                                    Player 2
                                                                                    <select id="player2">
                                                                                        <option value="0" selected>Paper</option>
                                                                                        <option value="1">Rock</option>
                                                                                        <option value="2">Scissors</option>
                                                                                    </select>

                                                                                    <input type="submit" id="fight" value="Fight">
                                                                                </form>

                                                                                <div id="resultOutput"></div>


                                                                                <script> 
                                                                                    // create our $() shortcut function for easily retrieving elements by id
                                                                                    var $ = function(id) {
                                                                                        return document.getElementById(id);
                                                                                    }

                                                                                    //function executed on page load
                                                                                    window.onload = function() {

                                                                                        //clear any previous values
                                                                                        document.forms[0].reset();

                                                                                        $("fight").onclick = fightCrunch;
                                                                                    }

                                                                                    var fightCrunch = function(){

                                                                                        var choices = ["Paper", "Rock", "Scissors"];
                                                                                        var player1 = $("player1").value;
                                                                                        var player2 = $("player2").value;
                                                                                        var result = "";
                                                                                        var diff = player1 - player2;

                                                                                        if (!diff)
                                                                                            result = "Both players chose " + choices[player1] + ", which results in a stalemate";
                                                                                        else if (diff == -1 || diff == 2)
                                                                                            result = "Player 1's " + choices[player1] + " beats Player 2's " + choices[player2];
                                                                                        else
                                                                                            result = "Player 2's " + choices[player2] + " beats Player 1's " + choices[player1];

                                                                                        $("resultOutput").innerHTML = result;
                                                                                        return false;
                                                                                    }

                                                                                </script>

祝好运！

编辑：使用返回和全局变量

var player1Choice, player2Choice;

window.onload = function () {

    //clear any previous values
    document.forms[0].reset();

    //store value from player1Weapon radio choice with the getPlayer1Choice function
    $("player1Submit").onclick = function () {
        player1Choice = getPlayer1Choice();
    };

    //store value from player1Weapon radio choice with the getPlayer2Choice function
    $("player2Submit").onclick = function () {
        player2Choice = getPlayer2Choice();
    };

    //assign the fight button to run the fightCrunch function to determine the winner
    $("fight").onclick = fightCrunch;
}

function getPlayer1Choice () {
    //...
    // return ...;
}

function getPlayer2Choice () {
    //...
    // return ...;
}

Answer 2

这里有很多问题。 最大的似乎是：

• 你假设player1Choice是一个字符串值（例如player1Choice == "Rock" ）并假设它是一个函数（ player1Choice("Paper") ）。 即使你假设它是一个函数，你也可以假设它返回一个布尔值的真/假值（ if (player1Choice("Paper")) ），当你的函数实际上返回一个字符串值（ "Paper" ）时。 因此，每次你检查player1Choice或player1Choice("Paper") ，它都会评估为true ，这显然不会起作用。