为什么此递归javascript函数表达式返回undefined？

Question

I wrote a solution to this standard everyday homework problem to solve Pascal's Triangle recursively. Console.log shows the answer my function derived. Printing to innerHTML of a div writes the answer to the screen. Stepping through the javascript debugger in chrome shows the solution array exists right before return returnArray. But still at the end of the day, the function returns "undefined". I don't get it.

var generate = function (numRows) {
    var startRow = 1;
    var startCol = 1;
    var endRow = parseInt(numRows);
    var rowArray = [];
    var returnArray = [];
    var triVal;

    var triangle = function (row, col) {
        //base case
        if (col == 1 || col == row) {   //If the element is the either first or last element then initialize it with 1
            if (col == 1) {
                rowArray = [];
            }
            triVal = 1;
            rowArray.push(triVal);

            if (col == row) {
                returnArray.push(rowArray);
            }
        }
        else {
            //calc
            triVal = returnArray[row - 2][col - 2] + returnArray[row - 2][col - 1]
            triVal = typeof (triVal) === "undefined" ? 1 : triVal;
            rowArray.push(triVal);
        }
        if (col == row && row == endRow) { //stop the function and return                    
            console.log(JSON.stringify(returnArray));
            myDiv2.innerHTML = JSON.stringify(returnArray);
            return returnArray;                                
        }
        else {
            if (col == row) {
                col = 1;
                row = row + 1;
            } else {
                col = col + 1;
            }
            triangle(row, col);
        }
    }
    triangle(startRow, startCol);           
};  
var test = generate(4);
console.log('test is: ' + test); //Why does it returned undefined

My first solution was in the form function generate(numRows){}; but the homework calls for the solution to be in the expression form var generate = function(numRows) {}; The first way returns my expected result. The second does not. What fundamental of javascript don't I understand?

Answer 1

var generate = function (numRows) {

    //numRows == 0 ? numRows = 1 : numRows = numRows;
    if (numRows == 0) { return [];}

    var startRow = 1;
    var startCol = 1;
    var endRow = parseInt(numRows);
    var rowArray = [];
    var returnArray = [];
    var triVal;


    var triangle = function (row, col) {
        //base case
        if (col == 1 || col == row) {   //If the element is the either first or last element then initialize it with 1
            if (col == 1) {
                rowArray = [];
            }
            triVal = 1;
            rowArray.push(triVal);

            if (col == row) {
                returnArray.push(rowArray);
            }
        }
        else {
            //calc
            triVal = returnArray[row - 2][col - 2] + returnArray[row - 2][col - 1]
            triVal = typeof (triVal) === "undefined" ? 1 : triVal;
            rowArray.push(triVal);
        }
        if (col == row && row == endRow) { //stop the function and return                    
            console.log(JSON.stringify(returnArray));
            myDiv2.innerHTML = JSON.stringify(returnArray);
            return returnArray;                                
        }
        else {
            if (col == row) {
                col = 1;
                row = row + 1;
            } else {
                col = col + 1;
            }
            triangle(row, col);
        }
    }
    triangle(startRow, startCol);
    return returnArray;  //duh...the obvious answer!!! 
};  
var test = generate(1);
console.log('test is: ' + (JSON.stringify(test)));