title: Laying out a Table with javascript
body: <p>I Need to make a table with javascript only (no html table tages or any frameworks).
  The code in "Eloquent javascript: CH 6" . this is the code </p>
  
  <pre><code>  name         height country
   ------------ ------ -------------
   Kilimanjaro    5895 Tanzania
   Everest        8848 Nepal
   Mount Fuji     3776 Japan
   Mont Blanc     4808 Italy/France
   Vaalserberg     323 Netherlands
   Denali         6168 United States
   Popocatepetl   5465 Mexico
  </code></pre>
  
  <blockquote>
    <p>Only Javascript codes</p>
  </blockquote>
  
  <pre><code>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);
      });
  }
  function drawTable(rows) {
      var heights = rowHeights(rows);
      var widths = colWidths(rows);
  
      function drawLine(blocks, lineNo) {
          return blocks.map(function (block) {
              return block[lineNo];
          }).join(" ");
      }
  
      function drawRow(row, rowNum) {
          var blocks = row.map(function (cell, colNum) {
              return cell.draw(widths[colNum], heights[rowNum]);
          });
          return blocks[0].map(function (_, lineNo) {
              return drawLine(blocks, lineNo);
          }).join("\n");
      }
  
      return rows.map(drawRow).join("\n");
  }
  </code></pre>
  
  <blockquote>
    <p>The rest of the code in the book </p>
  </blockquote>
  
  <p>I wanna to understand how it works.as it confused me</p>