javascript - 战舰游戏 - Javascript 指南

Question

我需要一些关于纯粹用 JavaScript 编写的战舰游戏的指导。

我的游戏由 7 个表格行和 7 个表格数据 (7x7) 的预制网格组成，其构建方式如下:

[00][01][02][03][04][05][06]
[10][11][12][13][14][15][16]
[20][21][22][23][24][25][26]
[30][31][32][33][34][35][36]
[40][41][42][43][44][45][46]
[50][51][52][53][54][55][56]
[60][61][62][63][64][65][66]

我目前只有一艘船，它随机前往 map 上的某个地方，并且水平设置在 3 个区域上。实现这一点的代码如下:

  var location1 = Math.floor(Math.random() * 48);
  var location2 = location1+1
  var location3 = location2+1

然后我有一个代码，因此我必须单击每个图 block 才能找到船的位置，如果命中/未命中，我会收到一条消息。

我的问题是，我必须在 map 上水平/垂直放置 3 艘船，并且我需要一些指导来了解最佳方法。我确信我可以创建更多变量，称为位置 4、5、6 等，但我认为这里最好将 3 艘船放在一个数组中。

您能给我一些帮助吗？用更简单的代码包装 3 艘船的最佳方法是什么？

Answer 1

您可以使用对象来使所有内容井井有条。您还可以创建一个方法将船放置在该对象内的字段上。您可以采取更多措施来改进代码，但请以此作为开始:

// direction: true = hor, false = vert - nicer solutions than "magic numbers" are possible
function Ship (size, direction) { 
    this.coveredFields = [];
    this.place         = function (sizeY, sizeX) { // sizeX & sizeY: size of fields in both dimensions

        // pick randomly within our limits
        var locationX;
        var locationY;
        if (direction) {
            locationX = Math.floor(Math.random() * (sizeX - 1 - size));
            locationY = Math.floor(Math.random() * (sizeY - 1));
        } else {
            locationX = Math.floor(Math.random() * (sizeX - 1));
            locationY = Math.floor(Math.random() * (sizeY - 1 - size));
        }

        // TODO: check that we don't cross/overlap other ships
        // ...

        // setting locations
        for (var i = 0 ; i < size ; i++) {
            if (direction) {
                this.coveredFields.push(locationY * 10 + locationX + i)
            } else {
                this.coveredFields.push((locationY + i) * 10 + locationX)
            }
        }
    }
}

然后，您可以使用 var Ship1 = new Ship(3,false); 创建 3 场长水平船使用 ship1.place(7,7) 将其放置在您的字段中；并使用 ship1.coveredFields 访问覆盖的字段(这是一个包含所有字段的数组)

如果这对您来说太复杂，只需对每个芯片的位置使用一个数组 (var Ship1 = [location1, location2, ... ]) - 但 OOP 很可能是最好的方法这样做。

<小时/>

另一个建议:用二维数组(即包含数组的数组)来描述你的字段。然后，将您的船只存储在该数组中，而不是船只内的坐标。这也使得不重叠的放置以及检查是否命中或未命中变得更加容易。

如果您不想这样做，因为它超出了您当前的技能水平，您应该考虑至少单独存储每个维度，而不是从两个维度中生成一个数字。您可以使用每个点都有两个元素的数组(第一个值为 x，第二个值为 y)，也可以使用如下所示的对象:{x : 5, y : 3}