用函數內的提示輸入填充數組

Question

所以我已經在這裏一段時間了，但不知道如何繼續。我的代碼詢問用戶名字，姓氏和年齡3人，然後將其顯示在表格中。

<script> 
 
    function person(firstName, lastName, age) { 
 

 
    for (var x = 1; x <= 3; x++) { 
 

 
     this.firstName = prompt("Please enter a first name", ""); 
 
     while (this.firstName == null || this.firstName == "") { 
 
     this.firstName = prompt("Invalid input. Please enter a first name", ""); 
 
     } 
 

 
     this.lastName = prompt("Please enter a last name", ""); 
 
     while (this.lastName == null || this.lastName == "") { 
 
     this.lastName = prompt("Invalid input. Please enter a last name", ""); 
 
     } 
 

 
     this.age = prompt("Please enter an age", ""); 
 
     this.age = parseInt(this.age); 
 
     while (this.age == null || isNaN(this.age) || this.age < 0) { 
 
     this.age = prompt("Not a valid input. Please enter an age", ""); 
 
     this.age = parseInt(this.age); 
 
     } 
 
    } 
 
    } 
 
    
 
    var personDetail = new person(); 
 
    
 
    document.writeln("<table>"); 
 
\t document.writeln(" <tr>"); 
 
\t document.writeln(" <th>First Name</th>"); 
 
\t document.writeln(" <th>Last Name</th>"); 
 
\t document.writeln(" <th>Age</th>"); 
 
\t document.writeln(" </tr>"); 
 
\t 
 
\t for (var z = 0; z < 5; z++) { 
 
\t \t document.writeln(" <tr>"); 
 
\t \t document.writeln(" <td>" + personDetail.firstName + "</td>"); 
 
\t \t document.writeln(" <td>" + personDetail.lastName + "</td>"); 
 
\t \t document.writeln(" <td>" + personDetail.age + "</td>"); 
 
\t \t document.writeln(" </tr>"); 
 
\t } \t 
 
\t 
 
\t document.writeln("</table>"); 
 
    
 
</script>

我知道我有收集用戶輸入到一個數組，但我不知道怎麼辦。

我試過以下。只是把名字爲例：

<script> 
 
    function person(firstName[]) { 
 

 
     for (var x = 1; x <= 3; x++) { 
 
     this.firstName[x - 1] = prompt("Please enter a first name", ""); 
 
     while (this.firstName[x - 1] == null || this.firstName[x - 1] == "") { 
 
      this.firstName[x - 1] = prompt("Invalid input. Please enter a first name", ""); 
 
     } 
 
     } 
 
    } 
 

 
    var personDetail = new person(); 
 

 
    for (var z = 0; z < 3; z++) { 
 
     document.writeln(personDetail.firstName[z]); 
 
    } 
 
    </script>

我知道有更容易的方法可以做到這一點，但我需要使用一個對象具有構造函數。

Answer 1

使用數組來存儲人

jsfiddle.net/0v7k1g7n/

var people = [ new person(), new person(), new person() ]; 

var table = document.getElementById("people"); 
for(var i = 0; i < people.length; i++){ 
    table.innerHTML += "<tr><td>" + people[i].firstName + "</td><td>" + people[i].lastName + "</td><td>" + people[i].age + "</td></tr>" 
} 

或所有

jsfiddle.net/0v7k1g7n/1

var People = function(){ 
    var data = []; 
    var table = document.getElementById("people"); 

    this.addPerson = function(p){ 
    data.push(p); 
    return this; 
    } 

    this.render = function(){ 
    for(var i = 0; i < data.length; i++){ 
     table.innerHTML += "<tr><td>" + data[i].firstName + "</td><td>" + data[i].lastName + "</td><td>" + data[i].age + "</td></tr>" 
    } 
    } 
} 

var p = new People(); 

p.addPerson(new person()).addPerson(new person()).addPerson(new person()).render();