Javascript 了解制作网格（雄辩的js第6章）

在雄辩的js的第6章中有一部分，在讨论了原型和构造器之后，他们介绍了如何布局一个表（更多细节可以参见）。我所要求的内容的完整代码在这里（）。然而，他们以块的形式呈现代码，因此我想首先问一个关于他们给出和分析的第一部分的问题，即：

function rowHeights(rows) {
  return rows.map(function(row) {
    return row.reduce(function(max, cell) {
      return Math.max(max, cell.minHeight());
    }, 0);
  });
}

function colWidths(rows) {
  return rows[0].map(function(_, i) {
    return rows.reduce(function(max, row) {
      return Math.max(max, row[i].minWidth());
    }, 0);
  });
}

在书中和我给出的完整代码中，以下函数的描述链接如下

1。

minHeight（）

返回一个数字，指示此单元格所需的最小高度（以行为单位）

2.

minWidth（）

返回一个数字，指示此单元格的最小宽度（以字符为单位）

3.

draw（width，height）

返回一个长度-高度数组，该数组包含一系列字符串，每个字符串的宽度为个字符。这表示单元格的内容

现在我在开始分析这段代码时遇到了困难

---

首先：排海试图做什么？从

.reduce

部分看，它让我觉得我们正在对所有行的高度求和，但是为什么我们要做

Math.max

？Math.max返回

max

或

cell.minHeight

，具体取决于哪个更大，那么我们为什么要这样做呢？

.map

在这里的工作情况如何？我以前使用过

.map

通过执行

arrayTwo=array.map…

，将一个数组映射到另一个数组，所以即使这样做，也不像我们将一个数组映射到另一个数组。我们返回rows.map，这有什么意义？我还有一些问题，但我想如果我理解了这些，我将能够继续前进。我很难理解这本书想要做什么，因为我不太清楚我们想要实现什么。

这两个函数所做的是返回行的高度数组和列的宽度数组

将迭代行/列集合，并为每一行/列获取reduce的结果。是一个累加器，它可以用来求和，但这里它被用来检查存在的最大值（因此是Math.max检查）

总体结果是一个行数组，每个值是每行的最大高度，一个列数组，每个值是每列的最大宽度

下面是一个在reduce中使用max的示例，显示它获取数组的最大值

var数=[1,2,3,4,5,6,7,8]；
var maxNumber=numbers.reduce（函数（prev，cur）{
返回Math.max（上一个，当前）；
},0);//0是在第一次迭代中分配给prev的默认值
console.log（maxNumber）//8

这将是一个很长的问题要回答，但这不是一个坏问题。我建议你在那里加入一些console.log语句，看看做了什么。这本书太令人沮丧了。他们通常从非常简单的例子开始，并给出很好的解释，然后用同样多的解释完成更复杂的代码行（至少对我来说）。希望其中一个答案能帮助你，但在我看来，这是你必须自己解决的问题之一。为什么我们需要行的高度数组和列的宽度数组。这对我们有什么帮助，无论我们想实现什么？@cresjoy-好吧，如果你知道一行中一个单元格的最大高度，你可以将整行设置为该高度以使单元格均匀。如果知道列中的最大宽度，可以将整个列设置为该宽度，以使单元格均匀。如果你知道每一行和每一列的最大高度，你就可以很容易地确定结果表的大小。我有点困惑。我们想做什么？“细胞”意味着什么？根据我的理解，网格有四列两行。和8个细胞。一排的“最大高度”是什么意思？或列的最大宽度？@cresjoy-一行通常被称为一行条目。在您链接到的示例中，从相关部分，一行数据将是

乞力马扎罗5895坦桑尼亚

。相反，列倾向于引用特定字段及其关联值。在您链接到的同一部分的示例中，一列数据将是

国家坦桑尼亚尼泊尔日本意大利/法国荷兰美国墨西哥

@cresjoy-还请记住，需要定义该列的原因只是表格的绘制方式，它使用精确的大小来制作文本表格。从您的链接：“我们的表格构建系统的工作方式是，builder函数将询问每个单元格的宽度和高度，然后使用此信息确定列的宽度和行的高度。然后，生成器函数将要求单元格以正确的大小绘制它们自己，并将结果组合成单个字符串。”