Array of objects in Javascript - using "push"

Question

I am very new with Javascript and I can't seem to find an explanation for what is happening with my code.

I want to create an array of "people" where each person has some information associated with them, like "id" and "name". I don't know how many "people" I would need in my array so I am using "push" when I need another person. My problem is my array ends up filled with the last person's information.

Here is my declarations that I am using:

var ppl_arr = [];
var profile = {
  id: 10000,
  name: " ",

};

profile.id=3;

ppl_arr.push(profile); //add this person to my array
alert(ppl_arr[0].id + "\t" + ppl_arr.length); 

profile.id=5;
ppl_arr.push(profile);  // push next person to the array
alert(ppl_arr[0].id+"\t"+ppl_arr[1].id + "\t"+ppl_arr.length);

The first alert displays correctly : "3 1"
In the second alert, I get " 5 5 2" instead of " 3 5 2"

So I get two entries into my array but the second one seems to overwrite the first one. Can anyone explain what is happening?

Assigning a new value to a property of an object does not cause it to become a new object. You're simply putting the exact same object in the array twice. — Pointy
– Pointy, Commented May 1, 2014 at 21:41
Also, your first alert() shows 4, not 3 (the "id" value), because you're adding two numbers together (3 and the length of the array, which is 1, giving 4). — Pointy
– Pointy, Commented May 1, 2014 at 21:43

OJay · Accepted Answer · 2014-05-01 21:50:18Z

2

You are simply changing the id of the same object, and adding the same object to the array twice. I would suggest that you create your 'people' objects as instance objects, something like this

//This is a constructor function for a Person object

function Person(id,name)
{
    this.Id = id;
    this.Name = name;
}

then

var ppl_arr = [];

ppl_arr.push(new Person(3,"Bob")); //add this person to my array

alert(ppl_arr[0].Id + " - " +  ppl_arr.length); //outputs "3 - 1"
//NOTE put a string inbetween, because Id and length are both integers, 
//you would actual get a sum of the two, not a string concatenation.

ppl_arr.push(new Person(5,"Steve"));  // push next person to the array

alert(ppl_arr[0].Id+"\t"+ppl_arr[1].Id + "\t"+ppl_arr.length); // outputs 3  5  2

answered May 1, 2014 at 21:50

OJay

4,9313 gold badges29 silver badges47 bronze badges

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

1 Comment

ChileAddict - Intel Over a year ago

Thanks! I"m getting closer! This example helped me understand what is going on with arrays of objects.

Eugen Rieck · Accepted Answer · 2014-05-01 21:45:18Z

2

Question #1:

alert(ppl_arr[0].id + ppl_arr.length); will display the sum, not the concatenation - try alert(ppl_arr[0].id.toString().concat(ppl_arr.length));

Question #2:

You change the id property of an existing object, not copy it. So you change the id of the object already in the array as well. So you would need to

var ppl_arr = [];
var profile = {
  id: 10000,
  name: " ",

};

profile.id=3;
ppl_arr.push(profile);


//Create a new profile
var profile2 = { 
  id: 10000,
  name: " ",

};

profile2.id=5;
ppl_arr.push(profile2);

answered May 1, 2014 at 21:45

Eugen Rieck

65.6k10 gold badges75 silver badges97 bronze badges

Collectives™ on Stack Overflow

Array of objects in Javascript - using "push"

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related