如何在制作简单的纸牌游戏时给卡片一个数值(Javascript)

时间:2013-11-12 17:30:06

标签: javascript

道歉,如果这听起来很愚蠢,但在编码方面我是一个完全的笨蛋!我正在尝试使用一副牌来制作一个更高或更低的猜谜游戏(即玩家猜测下一张牌是否会高于或低于显示的牌)但我真的不明白如何给每张牌一个值。

例如,我想给Ace卡一个“1”的值,这样一来就可以猜出下一张牌是高于还是低于1.

我知道数组&课程涉及但我似乎找不到用简单的英语解释它的教程。到目前为止,这是我的代码(& yes,我知道这很可怕!)

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled</title>
<script language="javascript" type="text/javascript">


var ask=window.confirm("Do you understand the rules of Higher or Lower?")
if (ask)
window.alert("Lets go!")
else
window.alert("Guess if the next card shown will be higher or lower than the current card.")

function rollDice()
{
var diceArray = ["card0.jpg","card1.jpg","card2.jpg","card3.jpg","card4.jpg","card5.jpg"];
var pickCard = diceArray[Math.floor(Math.random() * diceArray.length)];
document.getElementById("cards").src = pickCard;
}


</script>
<link rel="stylesheet" href="teststyle.css" type="text/css">
</head>
<body style="text-align: center;">
<br>
<big style="font-weight: bold; font-family: Helvetica,Arial,sans-serif;"><big><big>HIGHER
OR LOWER?</big></big></big><br>
<h3>Use your knowledge of probability to guess if the next card will be
higher or lower!</h3>
<br>
<br>
<img src="card5.jpg" onload="pickCard()" id="cards"><br>
<br>
<span
style="font-weight: bold; font-family: Helvetica,Arial,sans-serif;">VALUES</span><span
style="font-family: Helvetica,Arial,sans-serif;">: ACE, TWO, THREE,
FOUR, FIVE, SIX, SEVEN, EIGHT, NINE, TEN, JACK, QUEEN, KING</span><br>
<br>
<br>

</body>
</html>

3 个答案:

答案 0 :(得分:6)

我认为您可能会发现将每张卡表示为对象很有用:

{
    imagePath: "card0.jpg",
    value: 1,
    name: "Ace"
}

您可以将它们放在数组中:

var diceArray = [
    {
        imagePath: "card0.jpg",
        value: 1,
        name: "Ace"
    },
    {
        imagePath: "card1.jpg",
        value: 2,
        name: "Two"
    },
    // and so on...
];
var pickCard = diceArray[Math.floor(Math.random() * diceArray.length)];
document.getElementById("cards").src = pickCard.imagePath;

var pickedValue = pickCard.value;

您可以看到,pickCard中存储的结果现在是一个包含属性namevalueimagePath的对象。您可以稍后根据需要添加其他属性(suit等)。

答案 1 :(得分:0)

真的取决于你的情况,但有几种方法可以做到。我没有想到的“正确”方式。

你可以使用switch语句,但我认为更多的“javascript方式”是你的对象文字来映射你的值,如

  var cardValues = {
      "ace": 1,
      "king": 13,
      "queen": 12
  }

  //then you can get your card value from the 'name' very simply
  var value = cardValues["ace"] // => 1

答案 2 :(得分:0)

我认为最简单的方法是使用一个对象数组,每个对象的位置对应于它的值。像这样:

var diceArray = [
    {
        "card_name": "Ace",
        "value": 1,
        "card_image": "card0.jpg" // I'm guessing card0 is the ace, replace this with the correct card image if that is incorrect
    },
    {
        "card_name": "Two",
        "value": 2
        "card_image": "card1.jpg"
    }
    ... and so on
]

您的随机选择仍然以相同的方式运作:

var pickCard = diceArray[Math.floor(Math.random() * diceArray.length)];

由于您现在处理的是对象而不是简单的字符串,因此您可以像这样访问其数据:

var cardImage = pickCard.card_image;
var cardName = pickCard.card_name;

或者

var cardImage = pickCard["card_image"];
var cardName = pickCard["card_name"];