이 테이블 작성 코드는 JavaScript에서 어떻게 작동합니까?

Question

이 함수는 http://eloquentjavascript.net/입니다. 그것은 내 코드가 아니지만 무료 교과서에 있기 때문에 교육 목적으로는 좋을 것 같습니다. 누구든지 웹 사이트에 가서 얻을 수있을 때.

---

전체 코드는 테이블을 구축하는 데 사용됩니다; 이것이 첫 번째 부분입니다. 어쩌면 함수 내에 함수가 너무 많아서 혼란 스럽겠습니까?

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"); 
} 

두 번째 부분에서는 대답이 필요하지 않다고 생각합니다. 첫 번째 부분을 이해 한 후에해야한다면 두 번째 질문을 게시 할 것입니다.

나중에 코드가 더 많습니다. 그것이 도움이된다면, 나는 또한 코멘트에 질문하는 경우, 여기에 복사 할 수 있습니다. 감사합니다. :)

Answer 1

rowHeights은 테이블의 각 행의 높이를 포함하는 배열을 반환합니다. 각 행에 대해 행의 각 셀의 최대 높이를 가져 와서 높이를 가져옵니다.

는 내부에서 작업을 그것을 이해하기 : 셀과 이전의 최대 높이를 감안할 때

function(max, cell) { 
    return Math.max(max, cell.minHeight()); 
} 

이이 세포의 minHeight() 이전 최대 최대로 새로운 높이를 계산합니다.

위의 함수를 사용하여 행의 모든 ​​셀의 최대 높이를 가져 오는 행 (셀 배열)을 줄입니다. 이어서

:

return rows.map(PREVIOUS FUNCTION); 

모든 최대 높이의 배열을 반환 모든 행에 걸쳐 감소 기능을 실행.

colWidths은 동일한 열을 각 열의 너비를 가져 와서 해당 열의 각 셀을 최대로 가져옵니다.