Javascript - Returning values from a list

Question

I'm trying to return some values from a list that added some objects. Inside the loop, I'm getting the right output, but outside it, it's not working as it should. I might be failing in something basic, but I really can't find what it's going on. Here's what I have:

  var register = { name: "", number: "" };
  var listName = new Array();
  var listNumber = new Array();
  var listObject = new Array();

  listName.push("A");
  listName.push("B");
  listName.push("C");
  listNumber.push(1);
  listNumber.push(2);
  listNumber.push(3);

  for(var i = 0; i < listName.length; i++)
  {
     register.name = listName[i];
     register.number = listNumber[i];
     listObject.push(register);
     console.log(listObject[i].name) //"A" then "B" then "C"
     console.log(listObject[i].number) //"1" then "2" then "3"
  }

  console.log(listObject[0].name); //"C"
  console.log(listObject[1].name); //"C"
  console.log(listObject[2].name); //"C"
  console.log(listObject[0].number); //"3"
  console.log(listObject[1].number); //"3"
  console.log(listObject[2].number); //"3"

Thanks in advance for any further help!

There is only ever one register variable that gets mutated each iteration and pushed three times. — CertainPerformance
– CertainPerformance, Commented Aug 23, 2018 at 1:35
Are you aware that you can build arrays like ["A", "B", "C"] and [1, 2, 3], and even [{name: "A", number: 1}, {name: "B", number: 2}, {name: "C", number: 3}]? — Mulan
– Mulan, Commented Aug 23, 2018 at 2:20

Cappielung · Accepted Answer · 2018-08-23 01:43:39Z

1

@CertainPerformance is correct. Your lack of understanding of object references in JavaScript is causing this error.

register is declared as a variable outside your loop, so its scope is outside the loop. This means that every time your loop code runs, you reset the properties on the register object, and then you push the same object into the array. So in your example, the listObject array is made up of 3 identical references to the register object.

Change your loop to:

for(let i = 0; i < listName.length; i++) {
  let register = {name: listName[i], number: listNumber[i]};

  listObject.push(register);
}

answered Aug 23, 2018 at 1:43

Cappielung

3423 silver badges6 bronze badges

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

1 Comment

Anderson Gama Over a year ago

Thanks for replying!

undefined is our god · Accepted Answer · 2018-08-23 01:45:23Z

1

As said before, you have only one register variable which gets overriden every iteration.

You can push directly an object into listObject, without needing to declare an outer scope variable.

  var listName = new Array();
  var listNumber = new Array();
  var listObject = new Array();

  listName.push("A");
  listName.push("B");
  listName.push("C");
  listNumber.push(1);
  listNumber.push(2);
  listNumber.push(3);

  for(var i = 0; i < listName.length; i++)
  {
     listObject.push({ name: listName[i], number: listNumber[i] });
     console.log(listObject[i].name) //"A" then "B" then "C"
     console.log(listObject[i].number) //"1" then "2" then "3"
  }

  console.log(listObject[0].name); //"now A"
  console.log(listObject[1].name); //"now B"
  console.log(listObject[2].name); //"now C"
  console.log(listObject[0].number); //"now 1"
  console.log(listObject[1].number); //"now 2"
  console.log(listObject[2].number); //"now 3"

answered Aug 23, 2018 at 1:45

undefined is our god

5111 gold badge4 silver badges25 bronze badges

1 Comment

Anderson Gama Over a year ago

Thanks for replying!

Chase Owens · Accepted Answer · 2018-08-23 02:12:33Z

1

As the function iterates it adds a new register object. Each iteration the register objects keys and values are being updated.

Instead, create a register object each iteration and push it.

Like this:

for(var i = 0; i < listName.length; i++)
  {
     let registerObject = {name: listName[i], number: listNumber[i]};
     listObject.push(registerObject);
     console.log(listObject[i].name) //"A" then "B" then "C"
     console.log(listObject[i].number) //"1" then "2" then "3"
  }

answered Aug 23, 2018 at 2:12

Chase Owens

964 bronze badges

Collectives™ on Stack Overflow

Javascript - Returning values from a list

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related