澄清精辟的javascript ch.7 -电子生活中的网格查找

Question

雄辩的Javascript，第7章-电子生活

试图理解描述如何使用var网格的部分：

var grid = ["top left",    "top middle",    "top right","bottom left", "bottom middle", "bottom right"];
console.log(grid[2 + (1 * 3)]);
// → bottom right

任何可能的解释都会有帮助。这就是文本提供的内容，我需要澄清：“或者，我们可以使用一个大小为宽度×高度的数组，并确定(x，y)处的元素位于数组中的x+ (y×宽度)位置。”还有别的方法来重新表述这个解释吗？

Answer 1

在本例中，您正在创建一个3x2网格。

通常，你会这样做：

var grid = [["top left", "top middle", "top right"],
            ["bottom left", "bottom middle", "bottom right"]];

grid[1][2]; // "bottom right"

这很简单。我们制作了一个二维数组(一个矩阵)，正在使用grid[y][x]访问它。

您展示的示例是试图使用一维数组来模拟该矩阵。不太清楚你为什么要这么做。看清楚你想做什么并不是很明显。就我个人而言，我认为没有这样做的好处。

var grid = ["top left", "top middle", "top right",
            "bottom left", "bottom middle", "bottom right"];

grid[2 + (1 * 3)]; // "bottom right"

公式是grid[x + (y * width_of_grid)]。那么，为什么这样做呢？您的元素是3组，因此，您需要找到您想要的组从哪里开始，这就是y * width_of_grid所做的。一旦您找到了您想要的组的起始位置，然后添加x以获得所需的单元格。

同样，我也不知道为什么会将此作为一种选择。大多数开发人员会选择第一个选项，这是干净的，也是有意义的。第二个只是混乱和愚蠢。