Javascript 石头、布或剪刀游戏-不'；t返回谁赢的表达式等_Javascript

Javascript 石头、布或剪刀游戏-不'；t返回谁赢的表达式等

javascript

Javascript 石头、布或剪刀游戏-不'；t返回谁赢的表达式等,javascript,Javascript,我做了一个基本的“石头、布或剪刀”游戏。我对这个项目有一些疑问/问题。在我的浏览器上，不会显示谁获胜的消息。比如“电脑赢了”。我得到的是：计算机：纸张你：摇滚我的代码是： let userChoice = prompt("Do you choose Rock, Paper or Scissors?"); let computerChoice = Math.random(); if (computerChoice < 0.34) { computerChoice = "Rock";

我做了一个基本的“石头、布或剪刀”游戏。我对这个项目有一些疑问/问题。

在我的浏览器上，不会显示谁获胜的消息。比如“电脑赢了”。我得到的是：

计算机：纸张

你：摇滚

我的代码是：

let userChoice = prompt("Do you choose Rock, Paper or Scissors?");
let computerChoice = Math.random();
if (computerChoice < 0.34) {
computerChoice = "Rock";
} else if(computerChoice <= 0.67) {
computerChoice = "Paper";
} else {
computerChoice = "Scissors";
} 

let compare = function(choice1, choice2) {
if (choice1 === choice2) {
    document.getElementById('printwo').innerHTML =  'The result is a    tie!';
 }
 else if (choice1 === "Rock"){
     if (choice2 ==="Scissors") {
          document.getElementById('printwo').innerHTML =  'Rock wins';
         }

     else {
          document.getElementById('printwo').innerHTML =  'Paper wins';
         }
     }
     else if (choice1 === 'Paper') {
     if (choice2 === 'Rock') {
          document.getElementById('printwo').innerHTML =  'Paper wins';
         }
     else {
          document.getElementById('printwo').innerHTML =  'Scissors wins';
         }

     }
     else if (choice1 === 'Scissors') {
         if (choice2 ==='Rock') {
              document.getElementById('printwo').innerHTML =  'Rock wins';
             }
         else  {
             document.getElementById('printwo').innerHTML = 'Scissors wins';
             }
         }

};

 document.getElementById("print").innerHTML = "Computer: " + computerChoice + "</br>" + "You: " + userChoice;
 compare(userChoice, computerChoice);

最后但并非最不重要的一点，为什么在函数中使用

返回

（而不是

document.getElementById（）

）然后在

document.getElementById（）中调用函数不起作用
提前谢谢
我还想添加一个else语句，以便在用户没有选择这3个选项中的任何一个的情况下给出消息“请插入有效的响应”。但是我应该把它放在函数中的什么地方呢？我试着把它放在结尾，但不管我写什么，它总是显示信息
这不属于compare功能。
当您获得用户输入时，这将是最好的。
您可能希望反复询问用户，直到获得有效输入，例如：
const choices = ['Rock', 'Paper', 'Scissors'];
var userChoice;
while (true) {
  prompt("Do you choose Rock, Paper or Scissors?");
  if (choices.indexOf(userChoice) != -1) break;
  console.log('Invalid choice!');
}

顺便说一下，定义选项也可以简化设置计算机选项的方式：
let computerChoice = choices[Math.floor(Math.random() * choices.length)];

为什么我不能用一个包含许多代码行的函数来编写这个游戏，而不是使用这么多的if语句，比如：
else if（userChoice=='Paper'和&computerChoice=='Paper'）{
return（'It'satie！'）；}

由于choice1===choice2条件，您实际上没有那条精确的线。
在任何情况下，拥有所有这些if-else if都没有什么根本性的错误。
您可以使用不同的方法，例如面向对象的方法，
每一个物体都会知道其他的选择比它强，什么比不上它，
但这种方法是否会明显更好，这一点并不明显
最后但并非最不重要的一点是，为什么在函数内部使用return
（而不是document.getElementById（）
）然后在document.getElementById（）中调用函数不起作用
实际上，最好从compare
函数中删除所有重复的document.getElementById（'printwo'）.innerHTML=。
你可以这样写：
let compare = function(choice1, choice2) {
  if (choice1 === choice2) {
    return 'The result is a    tie!';
  } else if (choice1 === "Rock") {
    if (choice2 === "Scissors") {
      return 'Rock wins';
    } else {
      return 'Paper wins';
    }
  } else if (choice1 === 'Paper') {
    if (choice2 === 'Rock') {
      return 'Paper wins';
    } else {
      return 'Scissors wins';
    }
  } else {
    if (choice2 === 'Rock') {
      return 'Rock wins';
    } else  {
      return 'Scissors wins';
    }
  }
};

document.getElementById('printwo').innerHTML = compare(userChoice, computerChoice);

使用三元运算符？：
，可以实现更紧凑的书写风格：
  if (choice1 === choice2) {
    return 'The result is a    tie!';
  } else if (choice1 === "Rock") {
    return choice2 === "Scissors" ? 'Rock wins' : 'Paper wins';
  } else if (choice1 === 'Paper') {
    return choice2 === "Rock" ? 'Paper wins' : 'Scissors wins';
  } else {
    return choice2 === "Rock" ? 'Rock wins' : 'Scissors wins';
  }

以下是另一种数据驱动方法：
const rps = {
  rock: {
    paper: 'Paper wins',
    scissors: 'Rock wins'
  },
  paper: {
    rock: 'Paper wins',
    scissors: 'Scissors wins'
  },
  scissors: {
    rock: 'Rock wins',
    paper: 'Scissors wins'
  }
};

let compare = function(choice1, choice2) {
  if (choice1 === choice2) {
    return 'The result is a tie!';
  }
  return rps[choice1.toLowerCase()][choice2.toLowerCase()];
};

我还想添加一个else语句，以便在用户没有选择这3个选项中的任何一个的情况下给出消息“请插入有效的响应”。但是我应该把它放在函数中的什么地方呢？我试着把它放在结尾，但不管我写什么，它总是显示信息
这不属于compare功能。
当您获得用户输入时，这将是最好的。
您可能希望反复询问用户，直到获得有效输入，例如：
const choices = ['Rock', 'Paper', 'Scissors'];
var userChoice;
while (true) {
  prompt("Do you choose Rock, Paper or Scissors?");
  if (choices.indexOf(userChoice) != -1) break;
  console.log('Invalid choice!');
}

顺便说一下，定义选项也可以简化设置计算机选项的方式：
let computerChoice = choices[Math.floor(Math.random() * choices.length)];

为什么我不能用一个包含许多代码行的函数来编写这个游戏，而不是使用这么多的if语句，比如：
else if（userChoice=='Paper'和&computerChoice=='Paper'）{
return（'It'satie！'）；}

由于choice1===choice2条件，您实际上没有那条精确的线。
在任何情况下，拥有所有这些if-else if都没有什么根本性的错误。
您可以使用不同的方法，例如面向对象的方法，
每一个物体都会知道其他的选择比它强，什么比不上它，
但这种方法是否会明显更好，这一点并不明显
最后但并非最不重要的一点是，为什么在函数内部使用return
（而不是document.getElementById（）
）然后在document.getElementById（）中调用函数不起作用
实际上，最好从compare
函数中删除所有重复的document.getElementById（'printwo'）.innerHTML=。
你可以这样写：
let compare = function(choice1, choice2) {
  if (choice1 === choice2) {
    return 'The result is a    tie!';
  } else if (choice1 === "Rock") {
    if (choice2 === "Scissors") {
      return 'Rock wins';
    } else {
      return 'Paper wins';
    }
  } else if (choice1 === 'Paper') {
    if (choice2 === 'Rock') {
      return 'Paper wins';
    } else {
      return 'Scissors wins';
    }
  } else {
    if (choice2 === 'Rock') {
      return 'Rock wins';
    } else  {
      return 'Scissors wins';
    }
  }
};

document.getElementById('printwo').innerHTML = compare(userChoice, computerChoice);

使用三元运算符？：
，可以实现更紧凑的书写风格：
  if (choice1 === choice2) {
    return 'The result is a    tie!';
  } else if (choice1 === "Rock") {
    return choice2 === "Scissors" ? 'Rock wins' : 'Paper wins';
  } else if (choice1 === 'Paper') {
    return choice2 === "Rock" ? 'Paper wins' : 'Scissors wins';
  } else {
    return choice2 === "Rock" ? 'Rock wins' : 'Scissors wins';
  }

以下是另一种数据驱动方法：
const rps = {
  rock: {
    paper: 'Paper wins',
    scissors: 'Rock wins'
  },
  paper: {
    rock: 'Paper wins',
    scissors: 'Scissors wins'
  },
  scissors: {
    rock: 'Rock wins',
    paper: 'Scissors wins'
  }
};

let compare = function(choice1, choice2) {
  if (choice1 === choice2) {
    return 'The result is a tie!';
  }
  return rps[choice1.toLowerCase()][choice2.toLowerCase()];
};

非常感谢您的回答，但我不太明白您是否告诉我我可以做我提到的带有“&&&”的陈述。@SpencerHastings我在这段代码中没有看到一个&
有用的地方。嵌套的if-else都不能与其封闭条件合并。@SpencerHastings您的意思是else-if（userChoice=='Paper'&&computerChoice==='Paper'）
？实际上还不清楚，你为什么要这样写。您已经在检查if（choice1==choice2）
。不，我说的是一个完全不同的代码。例如：else-if（userChoice=='Paper'和&computerChoice=='Scissors'）{return'Computer-wines！'}
和else-if（userChoice=='Scissors'和&computerChoice=='Scissors'）{return'It is a tie'；}
。。。剩下的可能性也是一样@徐狐@janos@SpencerHastings我在回答中添加了一种数据驱动的方法，大大减少了条件语句非常感谢您的回答，但我不太明白您是否告诉我我可以用“&&”来完成我提到的语句或者不。@SpencerHastings我在这段代码中没有看到一个&&
有用的地方。嵌套的if-else都不能与其封闭条件合并。@SpencerHastings您的意思是else-if（userChoice=='Paper'&&computerChoice==='Paper'）
？实际上还不清楚，你为什么要这样写。您已经在检查if（choice1==choice2）
。不，我说的是一个完全不同的代码。例如：else if（userChoice=='Paper'和&computerChoice=='