Question

我试图打印一个名为蛇和梯子的棋盘游戏。我只设法打印第一个简单列。

var multiArray=[[" ___","|   |", "|   |","|___|"],
                ["|   |","|   |", "|___|","|   |"],
               ["| E |", "|___|","|   |","|   |"],
               ["|___|","|   |","|   |","|___|"],
               ["|   |","|   |","|___|","|   |"],
                ["| P |","|___|","|   |","|   |"],
                ["|___|"]];


for(var i=0; i<multiArray.length;i++){
    for(var j=0; j<multiArray[i].length;j++){
        print(multiArray[i][j]);
    }
}

执行：

 ___ 
|   |
|   |
|___|
|   |
|   |
|___|
|   |
| E |
|___|
|   |
|   |
|___|
|   |
|   |
|___|
|   |
|   |
|___|
|   |
| P |
|___|
|   |
|   |
|___|

我该怎么做才能让同一列再次打印7次，看起来像这样：

 ___ ___
|   |   |
|   |   |
|___|___|
|   |   |
|   |   |
|___|___|
|   |   |
| E |   |
|___|___|
|   |   |
|   |   |
|___|___|
|   |   |
|   |   |
|___|___| 
|   |   |
|   |   |
|___|___|  
|   |   |
| P |   |
|___|___|
|   |   |
|   |   |
|___|___|

我尝试使用.concat，但它只是将其添加到另一列的底部。除非我没有正确使用它，否则.join和.push也无法正常工作。

Answer 1

我能想到的一种方法是

var multiArray =
[
    [" ____",   "|   |",    "|   |",    "|___|"],
    ["|   |",   "|   |",    "|___|",    "|   |"],
    ["| E |",   "|___|",    "|   |",    "|   |"],
    ["|___|",   "|   |",    "|   |",    "|___|"],
    ["|   |",   "|   |",    "|___|",    "|   |"],
    ["| P |",   "|___|",    "|   |",    "|   |"],
    ["|___|"]
];

for (var i = 0; i < multiArray.length; i++) {
    for(var j = 0; j < multiArray[i].length; j++){
        // storing the second column. first col = second col
        var secondColumn    = multiArray[i][j];
        // checking if the column has E or P in it
        if (secondColumn.match(/(E|P)/)) {
            // if it does, change the column to empty one
            secondColumn = "|   |";
        }
        // print the same column twice (without E or P)
        console.log(multiArray[i][j] + secondColumn);
    }
}

由于您希望两次打印相同的列但没有字母E或P，因此使用简单的正则表达式可以解决问题。

如果您想在html页面中使用它，而不是在控制台或＆＃39; codeboot.org＆＃39;中，您的列会遇到问题。您不能在字符串中使用多个空格。 HTML页面将其解析为单个空格。您需要使用 更改空格。  表示单个空格。你可以多次使用它。

您可以看到空间问题here: fiddle。

编辑：您说要打印7次。下面的代码可以。

for (var i = 0; i < multiArray.length; i++) {
    for(var j = 0; j < multiArray[i].length; j++){
        var col = multiArray[i][j];
        if (col.match(/(E|P)/)) {
            col = "|   |";
        }
        console.log(multiArray[i][j] + col + col + col + col + col + col);
    }
}

我不知道E或P代表什么，所以其余的列都是空的。

<强> EDIT2：

如果您想使用当前代码添加或删除列，那将会令人不安。由于列没有组织，因此寻址到所需的列会很困难。我给你另一种方式。

<div id="container"></div>

var container = document.getElementById("container");
var rows = 7;
var cols = 8;

for (var i = 0; i < rows; i++) {
    container.innerHTML += '<div class="row"></div>';
    var curRow = container.getElementsByClassName("row")[i];
    for (var j = 0; j < cols; j++){
        curRow.innerHTML += '<div class="col"></div>';
    }
}

function addPlayer(p ,r, c) {
    var row = container.getElementsByClassName("row")[r-1];
    var col = row.getElementsByClassName("col")[c-1];
    col.innerHTML = p;
}

function clearColumn(r, c) {
    var row = container.getElementsByClassName("row")[r-1];
    var col = row.getElementsByClassName("col")[c-1];
    col.innerHTML = "";
}

// try passing player name, row number and column number
// in the given order
addPlayer("E", 3, 4);
addPlayer("P", 5, 2);

// you can also clear a specified column
// enter row number and column number
// clearColumn(5,2);

如果要改进这一点，您应该创建自己的html页面并使用HTML / CSS。在线翻译不是很有帮助。

您可以看到现场演示here: fiddle。

Answer 2

也许按行而不是按列打印出更容易。通过这种方式，您可以通过故意打印前一行下的每一行来解决下面只能打印下来的问题。

这需要重新定义您的多阵列，但第一行看起来像这样：

var upperBound  = '  _______________________'
var side        =  '|  |  |  |  |  |  |  |  | '
var bottomBound =  '|__|__|__|__|__|__|__|__|'
console.log(upperBound, '\n', side, '\n', bottomBound)

然后你可以再重复7次（没有upperBound），并获得你的董事会！

console.log(upperBound, '\n', side, '\n', bottomBound)
for(var i = 0; i < 7; i++){
    console.log(side, '\n', bottomBound)
}

希望有所帮助！

打印多维数组（棋盘游戏）

2 个答案: