将对象添加到现有的对象数组 - JavaScript

Question

我创建了一个包含 2 个对象的数组，并且我希望编写一个“添加”函数来动态地将更多人添加到这个数组中。

你能解释为什么下面的“添加”函数没有成功地将对象添加到“联系人”数组中。

var bob = {
    firstName: "Bob",
    lastName: "Jones",
    phoneNumber: "(650) 777-7777",
    email: "bob.jones@example.com"
};

var mary = {
    firstName: "Mary",
    lastName: "Johnson",
    phoneNumber: "(650) 888-8888",
    email: "mary.johnson@example.com"
};

var contacts = [bob, mary];
var contactsLength = contacts.length;

function add (firstName, lastName, phoneNumber, email) {
    contacts[contactsLength] = {
        firstName: firstName,
        lastName: lastName,
        phoneNumber: phoneNumber,
        email: email
    };
};


function printPerson(person) {
    console.log(person.firstName + " " + person.lastName);
}

function list() {
    for (var i = 0; i < contactsLength; i++) {
        printPerson(contacts[i]);
    }
}

add("MJ", "Foster", "MJ@gmail", "714-333-5555");

list();

Answer 1

您的代码没有按照您认为应该的方式工作的原因是因为这一行：

var contactsLength = contacts.length;

在这里，您将contacts.length的值分配给变量contactsLength ，但此后，即使contacts数组的大小发生变化， contactsLength也不会改变。

相反，您应该简单地引用属性contacts.length 。

这是您的代码的更正版本：

var bob = {
    firstName: "Bob",
    lastName: "Jones",
    phoneNumber: "(650) 777-7777",
    email: "bob.jones@example.com"
};

var mary = {
    firstName: "Mary",
    lastName: "Johnson",
    phoneNumber: "(650) 888-8888",
    email: "mary.johnson@example.com"
};

var contacts = [bob, mary];

function add (firstName, lastName, phoneNumber, email) {
    contacts[contacts.length] = {
        firstName: firstName,
        lastName: lastName,
        phoneNumber: phoneNumber,
        email: email
    };
};


function printPerson(person) {
    console.log(person.firstName + " " + person.lastName);
}

function list() {
    for (var i = 0; i < contacts.length; i++) {
        printPerson(contacts[i]);
    }
}

add("MJ", "Foster", "MJ@gmail", "714-333-5555");

list();

请注意：使用本机数组方法push() ，会做与contacts[contacts.length] = {...}完全相同的事情。

Answer 2

尝试使用推送方法

 function add (firstName, lastName,  phoneNumber, email) { 
var newContact = { 
    firstName: firstName, 
    lastName: lastName, 
    phoneNumber: phoneNumber, 
    email: email 
    }; 
    contacts.push(newContact);
 };

Answer 3

您的Add函数工作正常，尽管更好的方法是根据 @MysterX 使用push()方法，因为跟踪数组索引可能并不总是非常可靠，特别是如果您使用公共变量来跟踪它。 push()方法

您的错误出在printPerson函数中。 仔细查看您的for循环并将其更改为

function list() {
    for (var i = 0; i <= contactsLength; i++) {
        printPerson(contacts[i]);
    }
}

看看你是否能发现错误......

希望这可以帮助。