JS for循环不能正常工作,试图遍历变量数组

时间:2015-04-17 21:46:22

标签: javascript arrays for-loop

我正在尝试用Javascript编写骰子游戏Yahtzee以获得乐趣。我有一个基本的界面设置与骰子的图像。在提到我的问题时,要了解一些Yahtzee规则:

有5个骰子

在3次掷骰之后,玩家必须选择一个得分点类别

以下代码无效:

var die1 = Math.floor((Math.random() * 6) + 1),
die2 = Math.floor((Math.random() * 6) + 1),
die3 = Math.floor((Math.random() * 6) + 1),
die4 = Math.floor((Math.random() * 6) + 1),
die5 = Math.floor((Math.random() * 6) + 1),
dieArray = ["", die1, die2, die3, die4, die5],
optionResult1 = 0;

document.getElementById("option1").onclick =  function() {
if (rollCount == 3 & option1 == false) {
    for (i=0; i < 5; i++) {
        i++;
        if (dieArray[i] == 1) {
            optionResult1++;
        }
        if (i = 5) {
            option1 = true;
            document.getElementById("optionResult1").innerHTML = optionResult1;
            console.log("finished");
        }
    }
            console.log(optionResult1);
} else if (rollCount != 3) {
    document.getElementById("dialogue").innerHTML = "You cannot pick this yet because you have not rolled 3 times.";
} else if (option1 == true) {
    document.getElementById("dialogue").innerHTML = "You cannot pick this because you have already used this category.";
}
}

应该发生什么(假设它是第三次滚动并且之前尚未选择此积分类别):

for循环应该通过dieArray,对于每个&#34; one&#34;的die,将optionResult1变量加1。如果有三个&#34;那么&#34;在五个骰子中,optionResult1应该是&#34; 3&#34;等等。

反而发生的事情是,它通常会比它应该的少1。即使我可以在控制台中看到阵列清楚地显示三个&#34;&#34;,它会给我&#34; 2&#34;,或者有时&#34; 0&#34;。你看到的代码有什么问题吗?文档中显然还有其他代码,但我相当确定问题出在这个函数中。对不起,如果这让人感到困惑,如果你玩过Yahtzee,可能会更容易理解...

我知道我可以用5 if语句来做同样的事情,但我试图从中学习,我相信这应该工作,我必须做错事。谢谢!

1 个答案:

答案 0 :(得分:-2)

我花了半个多小时写这篇文章。请使用它。

var die1 = 0,
    die2 = 0,
    die3 = 0,
    die4 = 0,
    die5 = 0,
    dieArray = [],
    dialogue = document.getElementById('dialogue'),
    scorecard = document.getElementById('scorecard'),
    possible = document.getElementById('possible'),
	score = 0,
	die1cell = document.getElementById('die1'),
	die2cell = document.getElementById('die2'),
	die3cell = document.getElementById('die3'),
	die4cell = document.getElementById('die4'),
	die5cell = document.getElementById('die5'),
	amountOf1 = 0,
	amountOf2 = 0,
	amountOf3 = 0,
	amountOf4 = 0,
	amountOf5 = 0,
	amountOf6 = 0,
	triple = 0,
	whichtriple = 0,
	double = 0,
	whichdouble = 0;

function roll(){
	//Reset total
	score = 0;
	triple = 0;
	double = 0;
	whichtriple = 0;
	whichdouble = 0;
	amountOf1 = 0;
	amountOf2 = 0;
	amountOf3 = 0;
	amountOf4 = 0;
	amountOf5 = 0;
	amountOf6 = 0;
	die1 = 0;
    die2 = 0;
    die3 = 0;
    die4 = 0;
    die5 = 0;
	possible.innerHTML = '<li>None</li>';
	//Defining die rolls inside function so each turn's results are different
	die1 = Math.floor((Math.random() * 6) + 1);
    die2 = Math.floor((Math.random() * 6) + 1);
    die3 = Math.floor((Math.random() * 6) + 1);
    die4 = Math.floor((Math.random() * 6) + 1);
    die5 = Math.floor((Math.random() * 6) + 1);
	dieArray = [die1, die2, die3, die4, die5];
	//For loop adding each die roll to the score and checking for multiple of one score
	for(var i = 0; i < dieArray.length; i ++){
		score += dieArray[i];
		eval("amountOf"+dieArray[i]+"++");
	}
	//Chucking the results back into the <table>
	die1cell.innerHTML = dieArray[0];
	die2cell.innerHTML = dieArray[1];
	die3cell.innerHTML = dieArray[2];
	die4cell.innerHTML = dieArray[3];
	die5cell.innerHTML = dieArray[4];
	scorecard.innerHTML = score;
	//Checking all the amountOf variables for values of over two and three
	for(var i = 1; i < dieArray.length + 1; i++){
		eval("if(amountOf"+i+" >= 3){triple ++;whichtriple = "+i+"}");
		eval("if(amountOf"+i+" >= 2){double ++;whichdouble = "+i+"}");
	}
	if(triple != 0 || double != 0){
		possible.innerHTML = '';
		possible.innerHTML += '<li>'+triple+' triple number ('+whichtriple+')</li>';
		possible.innerHTML += '<li>'+double+' double number(s) ('+whichdouble+')</li>';
	}
}
table, td, th{
	border-collapse: collapse;
}
th, td{
	border: 1px solid black;
	padding: 10px 0px;
	width: 80px;
	text-align: center;
}
th{
	font-weight: 400;
}
<button id='option1' onclick='roll()'>Roll</button><br>
<table>
	<tr>
		<th>Dice roll 1</th>
		<th>Dice roll 2</th>
		<th>Dice roll 3</th>
		<th>Dice roll 4</th>
		<th>Dice roll 5</th>
		<th>Total</th>
	</tr>
	<tr>
		<td id='die1'>N/A</td>
		<td id='die2'>N/A</td>
		<td id='die3'>N/A</td>
		<td id='die4'>N/A</td>
		<td id='die5'>N/A</td>
		<td id='scorecard'>N/A</td>
	</tr>
</table>
Possible scoring moves:
<ul id='possible'>
	<li>None</li>
</ul>

运行^^^