can’t get this code to work and have a few specific questions.

I am reading “Eloquent Javascript” and am trying to do a project in chapter 6. all the code I entered looks correct but it wont display the output which should be a 5X 5 grid.

some specific parts of the code I don’t understand are

function drawLine(blocks, lineNo) {

return blocks.map(function(block) {

return block[lineNo];

}).join(" ");

for this one, I don’t understand what the computer is doing to the arguments of the function with regards to the “return block[lineNo]” statement…

textCell.prototype.draw = function(width, height) {

var result = [];

for (var i = 0; i < height; i++) {

var line = this.text[i] || "";

result.push(line + repeat( " ", width - line.length));

}

for this part, in my mind, the function should iterate through as many times as there are “height” units, and then it should set the line variable to an amount of text containing as many characters as their are height units.

however, the book im reading says that it makes sure that each line has the right amount letters so it is the right width…… just confused about this.

and finally, the code will not compile, I do not know why, here is all of the code.

function map(array, transform) {

var mapped = [];

for (var i = 0; i < array.length; i++)

mapped.push(transform(array[i]));

return mapped;

}

function reduce(array, combine, start) {

var current = start;

for (i = 0; i < array.length; i++)

current = combine(current, array[i]);

return current;
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(row);

var widths = colWidths(row);
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(" ");

}

return rows.map(drawRow).join("\n");

}
function repeat(string, times) {

var result = "";

for (var i = 0; i < times; i++)

result += string;

return result;

}

function textCell(text) {

this.text = text.split("\n");

}

textCell.prototype.minWidth = function() {

return this.text.reduce(function(width, line) {

return Math.max(width, line.length);

}, 0);

};

textCell.prototype.minHeight = function() {

return this.text.length;

};

textCell.prototype.draw = function(width, height) {

var result = [];

for (var i = 0; i < height; i++) {

var line = this.text[i] || "";

result.push(line + repeat( " ", width - line.length));

}

return result;

}
var rows = [];

for (var i = 0; i < 5; i++) {

var row = [];

for (var j = 0; j < 5; j++) {

if ((j + i) % 2 == 0)

row.push(new textCell("##"));

else

row.push(new textCell(" "));

}

rows.push(row);

}
console.log(drawTable(rows));

}

Thank you for your time!

Mapping over an array gives you a new array of the same length. In this case, the new array contains the line number of each block;

That would be the result.push line that ensures that it’s the right width, for it adds the same number of spaces after each character, helping to spread out the text across the available space.

Using Beautifier on the code helps me to see that there’s no missing opening/closing braces. It does however show me that you have most of the code inside of the reduce function, which you might not have intended to occur.

This has been completely resolved, after fixing the reduce function error, I just had to change “row” to “rows” in the drawTable function.

This was a big help thank you!

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.