简单的JavaScript游戏[Mastermind]问题

时间:2014-05-17 22:39:45

标签: javascript arrays

我正在编写经典棋盘游戏"Mastermind"的简单JavaScript版本。

我有一些(肯定是基本的)问题,99%使用JavaScript数组并引用它们的值或元素。这些问题是我解决"目前很长一段时间,所以我决定问。


事实:

  • 我的游戏挂钩,游戏板完全是在HTML表格中制作的,挂钩是这样实现的(一行包含4个挂钩和一个包含结果图像的td):

    <td>
        <a href="javascript:void(0)"
           onClick="changePegColor('0','0'); return false"
           onFocus="this.blur()">
            <img src="img/void.png" width=22 height=22  name="peg_0_0">
        </a>
    </td>
    
  • 我的默认数组声明看起来像这样(显示了两个变种,但没有一个适用于我):

    var pegsAI = ['pegAI_0', 'pegAI_1', 'pegAI_2', 'pegAI_3'];
    var pegsAI = new Array('pegAI_0', 'pegAI_1', 'pegAI_2', 'pegAI_3');
    
  • 设置AI的钉子,这是玩家猜测的方式(这是有效的,阵列没问题):

    pegsAI[position] = Math.floor((Math.random() * possibleColorsNumber));
    

以下是我的问题:

  1. 在单击“提交”按钮的时刻,检查连续的每个挂钩是否都有这样的颜色(这不起作用,也不会在chrome F12中引发错误):

    ...
    for (var position = 0; position <= 3; position++) {
        if (document["peg_" + currentRow + "_" + position].src === "img/void.png") {
                alert('Finish color picking!');
            return false;
        }
    }
    ...
    
  2. 在此检查之后,有一个函数应该将玩家钉子转换为数字并将其保存到数组中并且可能存在问题,因为它不起作用(数组得到undefined值结果):

    function convertToNumbers() {
        for (var position = 0; position <= 3; position++) {                                         //4 pegs in row, var 'position' declares peg's position
            if (document["peg_" + currentRow + "_" + position].src === possibleColors[index] ) {  //if a peg has an color (his img's src is equal to an element of array 'possibleColors', which contains possible img's src's), then ->
                pegsPlayer[position] = index;                                                       // -> then index of this color saves to pegsPlayer[] array
            }
        }
    }  
    

  3. ///添加了解释

    我的计算分数函数:

    var goodPegPlayer = [false, false, false, false];
    var goodPegAI = [false, false, false, false];
    
    function calcSkore() {
    convertToNumbers();
    alert("array values" + pegsPlayer[0] + "_" + pegsPlayer[1] + "_" + pegsPlayer[2] + "_" + pegsPlayer[3]);
    for (var position = 0; position <= 3; position++) {
        goodPegPlayer[position] = false;
        goodPegAI[position] = false; 
        if (pegsPlayer[position] === pegsAI[position]) {
            skoreBlack++;
            goodPegPlayer[position] = true;
            goodPegAI[position] = true;
        }
    } 
    
    for (var position = 0; position <= 3; position++) {
        if (goodPegPlayer[position] === false) {
            for (var positionAI = 0; positionAI <= 3; positionAI++) {
                if ((position !== positionAI) && (goodPegPlayer[position] === false) && (goodPegAI[positionAI] === false)) {
                    if (pegsPlayer[position] === pegsAI[positionAI]) {
                        skoreWhite++;
                        goodPegPlayer[position] = true;
                        goodPegAI[positionAI] = true;
                    }
                }
            }
       }
    }
    
    resultsSubmit();
    
    }
    

    !!在此函数中使用converToNumber()函数后,使用alert()来检查值是否正确。

2 个答案:

答案 0 :(得分:1)

您没有正确访问DOM。尝试使用id属性代替name来识别您的图片并按如下方式更新您的JavaScript:

for (var position = 0; position <= 3; position++) {
    var id = "peg_" + currentRow + "_" + position;
    if (document.getElementById(id).src === "img/void.png") {
            alert('Finish color picking!');
        return false;
    }
}

答案 1 :(得分:0)

我在2004年写了自己的Mastermind版本。

代码有点过时,但它仍适用于现代浏览器。我不确定它是否对您有帮助,但请随时查看!

该代码是MIT许可的,这意味着您可以随意在任何地方使用它(或部分内容)!

资源

enter image description here