javascript - 尝试使用 jQuery 从对象数组创建简单的表

Question

我试图通过循环对象数组来使用 jQuery 创建一个简单的表，但在控制台中收到此消息:

TypeError: 'undefined' is not an object (evaluating 'people[i].lastName')

如果我定义特定对象(即 John.lastName)但不使用 array[i]，它会起作用，我做错了什么吗？

var person = function(firstName, lastName) {
    this.firstName = firstName || "Anonymous";
    this.lastName = lastName || "Anonymous";
    };

    var John = new person("John", "Walter");
    var Bob = new person("Bob", "Stevens");
    var Gerry = new person("Gerry", "Cricket");
    var Frank = new person("Frank", "Bloom");

    var people = [John, Bob, Gerry, Frank];

    for (i = 0; i < people.length; i++) {

    $(document).ready(function() {
    $("body").append("<table><tr><td>" + people[i].lastName + "</td></tr></table>");
    });

    };

Answer 1

You can't put a $(document).ready within a for loop. Put your function inside the document.ready and your code works fine. To Add a table before the for loop and the /table 
after the for loop to prevent making each row in the array a table.

     $(document).ready(function()
  {
var person = function(firstName, lastName) {
    this.firstName = firstName || "Anonymous";
    this.lastName = lastName || "Anonymous";
    };

    var John = new person("John", "Walter");
    var Bob = new person("Bob", "Stevens");
    var Gerry = new person("Gerry", "Cricket");
    var Frank = new person("Frank", "Bloom");

    var people = [John, Bob, Gerry, Frank];
        $("body").append("<table>");

    for (i = 0; i < people.length; i++) {
console.log(people[i]);

   $("table").append("<tr><td>" + people[i].lastName + "</td></tr>");

    };
    $("<table>").append("</table>");
    });