Update 'nested' javascript object dynamically

Question

I'm trying to create an object that is updated dynamically.

Here's the setup of the type of object I'd like to create (note: I may add other things, such as address, country, etc to the keys):

var contacts = {"Bruce Wayne":{"phone number":'123-456-7890', "email":"[email protected]"}, "Alfred":{"phone number" :'987-654-3210', "email": "[email protected]"}, "Clark Kent":{"phone number":'951-753-8520', "email":"[email protected]"}}

So for each name (Bruce Wayne, Alfred, ...) I have some keys assigned to them.

I'm using npm faker to generate some fake data to try and populate an array like the above, with the outline

I'm able to get a loop going, but it always returns the last iteration's data. I understand it's because I'm doing contact = .... Since this is an object, I can't use push, AFAIK.

function getContact(numContacts){
    contacts = {}
    for (var i = 0; i < numContacts; i++){
        console.log(i);
        var name = faker.name.firstName() + " " + faker.name.lastName();
        var phoneNum = faker.phone.phoneNumber();
        var email = faker.internet.email();
        contacts = {name :{ "phone number": phoneNum, "email": email}}
        // contacts.name = {"phone number": phoneNum, "email":email};  // this also returns just the last instance.
    };
    return contacts;
};

var contacts = getContact(10); // This should create ten people, each with a phone number and email.

The loop almost successfully creates a single name. This returns:

name, 761.704.3328 x4287, [email protected]

But in that iteration, name variable is actually Joe Schmoe, not literally name...

What am I overlooking to make sure that the contacts object gets populated with 10 people, with the resolved name, not just the last in the iteration?

To add new property to your object, you need to do contacts[somePropertyName] = {...}. Doing contacts = {...} just replaces everything that was previous in the contacts object with a whole new object that only has the latest stuff in it. All previous contents are no longer there in the new object. — jfriend00
– jfriend00, Commented Jan 25, 2018 at 0:19

Community · Accepted Answer · 2020-06-20 09:12:55Z

2

Observations

You're trying to use name variable as key, however, what you're doing is adding a key literally called name.
What you have to do, is to create the key programmatically as follow: contacts[name] and assign the object with phoneNumber and Email.
This code is an example to simulate your scenario.

var faker = {
  name: {
    firstName: function() {
      return "Clark";
    },
    lastName: function() {
      return "Kent";
    }
  },
  phone: {
    phoneNumber: function() {
      return '951-753-8520';
    }
  },
  internet: {
    "email": function() {
      return "[email protected]";
    }
  }
};

function getContact(numContacts) {
  var contacts = {}
  for (var i = 0; i < numContacts; i++) {
    var name = faker.name.firstName() + " " + faker.name.lastName();
    var phoneNum = faker.phone.phoneNumber();
    var email = faker.internet.email();

    contacts[name + '_' + i] = {
      "phone number": phoneNum,
      "email": email
    }
  }

  return contacts;
}

var contacts = getContact(10);

console.log(contacts);

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Jan 25, 2018 at 0:35

Ele

33.8k7 gold badges43 silver badges80 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

BruceWayne Over a year ago

All the faker stuff is taken care of by the npm package. I'm learning JavaScript so to me it looks like the main solution you have is the same as the one I selected. Am I missing something?

Ele Over a year ago

Basically, the same answer. However, I've put some observations to guide you. :-)

BruceWayne Over a year ago

excellent, that's what I thought! I appreciate it, it gives me insight on how to set up my own thing like that in the future. :D

Vasan · Accepted Answer · 2018-01-25 00:19:40Z

1

The names are the keys in your object. You can use it like an array index to populate contacts. This should work:

contacts[name] = {"phone number": phoneNum, "email": email}

answered Jan 25, 2018 at 0:19

Vasan

4,9564 gold badges22 silver badges41 bronze badges

1 Comment

BruceWayne Over a year ago

Man, I struggled so much with this earlier, and I swear I tried that, but must have done it wrong at the time. This works, and seems like the easiest/best way. Thanks!

Collectives™ on Stack Overflow

Update 'nested' javascript object dynamically

2 Answers 2

Observations

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Observations

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related