2016-09-04 2 views
0

私はスチューデントオブジェクトを私の配列に追加する方法を知りました。一度それを修正したら、配列の中にあるものをテーブルにhtmlファイルで表示しようとしました。配列からテーブルにオブジェクトを追加する

学生オブジェクト:

var Student = function (fullName, email, phone, category, groupID) { 
    this.fullName = fullName; 
    this.email = email; 
    this.phone = phone; 
    this.category = category; 
    this.groupID = groupID; 
}; 

studentArray:

var studentArray = new Array(Student); 

makeTable機能:

function makeTable() { 
    var student1 = new Student("Waw","waaw","awaw","waaw","waaw"); 
    studentArray.push(student1); 
    document.write("<table>"); 
    document.write("<thead><tr><th>Full Name</th><th>Email</th><th>Phone</th><th>Category</th><th>Group</th></tr></thead>"); 
    document.write("<tbody>"); 
    for(i = 0; i < studentArray.length; i++){ 
    document.write("<tr><td>" + studentArray[i].fullName +"</td><td>" + studentArray[i].email +"</td><td>" + studentArray[i].phone +"</td><td>" + studentArray[i].category +"</td><td>" + studentArray[i].groupID +"</td></tr>"); 
    } 
    document.write("</tbody>"); 
    document.write("</table>"); 
} 

HTMLファイル:

<html> 
    <head> 
     <title>TODO supply a title</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <script src="../script/scripts.js" type="text/javascript"></script> 

    </head> 
    <body> 
     <script> 
      makeTable(); 
      </script> 
    </body> 
</html> 

出力:

http://i.imgur.com/K9UWIyx.png

私は配列を作ったかのように私はJavaでregularyプログラムが正常に、しかし、私はこれが機能していない想像できる唯一の理由は、ありますStudentArrayにstudent1を挿入した後も、配列が空です。

ありがとうございます。

+0

このフィドルと

var studentArray = new Array(Student);

が働いて、それを示して置き換えますあなたの 'Student'関数と等しい要素を持つ配列を開始するので、' undefined'値を返します。あなたのコードにテーブルに値が設定されない原因となっている何か他のものがあります。 –

答えて

1

javascriptのは、弱く型付けされた言語このラインwhith(more about language sthrength

あなたはアレイのタイプとして「Stundent」を定義していますが(あなたのコンテキスト内に存在しない)学生という名前のオブジェクトをプッシュしINSEADされていないです配列 'studentArray'に挿入します。 stundenArrayに未定義またはnullをプッシュすることを意味します。

var studentArray = new Array(Student); 

あなたはこれにそれを変更する場合は、空の配列

var studentArray = new Array(); 

を作成ウィルと、コンパイラはdoesnのため、一部のブラウザでは、次の行に例外がスローされますので、それは

を動作するはずですヌルを指すオブジェクトのプロパティを知りません

document.write("<tr><td>" + studentArray[i].fullName +"</td><td>" + studentArray[i].email +"</td><td>" + studentArray[i].phone +"</td><td>" + studentArray[i].category +"</td><td>" + studentArray[i].groupID +"</td></tr>"); 
+0

うわー...すみません。私はJavaのように、配列を知らせなければならないと思っていました。どの型を保持するべきか...とても兄さんありがとう。 –

+1

彼の答えに正しいplzをマーク –

+1

これは、可視化された問題、つまり空のテーブルには答えません。 'new Array(Student)'はまだ新しい配列を作成します。それは単一の要素から始まります。これは 'Student'関数です。ループが 'makeTable()'で作られた実際の 'Student'インスタンスを表示するのを妨げません。この[JSFiddle](https://jsfiddle.net/zqew935L/)はそのまま動作していますが、コードに何か問題があります –

1

ヨuは配列にStudent関数もプッシュしていますが、そうする必要はありません。それはundefined値を返すようになります。それはあなたがの行を取得することを示しているものの、https://jsfiddle.net/zqew935L/:

単に

var studentArray = new Array();

+1

感謝がexecptに失敗しなかった場合 –

+0

これは他の答えと同じように、問題に答えることはできません。ただ、1要素で初期化された配列を作成してから空の配列にしただけです。作成した学生を 'makeTable()'に追加した後でも空のテーブルが残ることはありません –

+0

それは本当です、Patrick。 データがあれば、これは最初の適切な応答のように見え、明らかにWilliamの問題も解決しました。 私の推測では、彼が含まれている他のスクリプトファイルが競合を引き起こす可能性があります。 または、コードに関連していないものがあります。 –

関連する問題