的Javascript：創建隨機數學方程的數組作爲對象，20倍

Question

What it's supposed to look like

我任務是動態創建20道數學題。數學問題必須在呈現之前以對象數組的形式創建。我堅持的部分是創建20個不同的隨機方程作爲數組中的對象，並將它們調用到表中。這是我到目前爲止。

<script> 

    // creates a random number from 1-100 
var randNum1 = Math.floor(Math.random() * 100) + 1; 

var randNum2 = Math.floor(Math.random() * 100) + 1; 

// creates a random operator 
var op = ["*", "+", "/", "-"][Math.floor(Math.random() * 4)]; 


var problemList = [{number1: randNum1, operator: op, number2: randNum2}, 

]; 



var problems, i; 


var displayProblems = function (problems) { 
    // open the table 
    var str = "<table class=table>"; 

    for (i = 0; i < problems.length; i++) { 
     str += "<tr>"; 
     str += "<td>" + problems[i].number1 + " " + problems[i].operator + " " + problems[i].number2 + " " + "<input type='text' class='answer' id='answer_" + i + "' /></td>"; 
     str += "</tr>"; 

    } 

    str += "</table>"; 

    document.getElementById("mathGrid").innerHTML = str; 
}; 

window.onload =function() { 
    displayProblems(problemList); 

}; 

</script> 

我一直堅持這一整天，並不知道如何做到這一點。這是我第二次分配給javascript，任何幫助將不勝感激。

這是我在行動中的一個例子。 JS Fiddle

Answer 1

當解決這樣的問題時，我會做的第一件事就是簡化它。

開始通過使創建只是一個單一的隨機問題，像這樣的功能：

function generateProblem() { 
    // creates a random number from 1-100 
    var randNum1 = Math.floor(Math.random() * 100) + 1; 
    var randNum2 = Math.floor(Math.random() * 100) + 1; 

    // creates a random operator 
    var op = ["*", "+", "/", "-"][Math.floor(Math.random() * 4)]; 

    return {number1: randNum1, operator: op, number2: randNum2}; 
} 

注意，具有該功能後，你已經可以測試一下，看看什麼工作。

之後，使其中20個更容易，你只需要調用該函數20次，並將結果添加到數組。通過手：

var problemList = [ 
    generateProblem(), 
    generateProblem(), 
    generateProblem() 
    ... 
]; 

或者使用一個循環：

var problemList = []; 
while (problemList.length < 20) { 
    problemList.push(generateProblem()); 
}