JS Array of objects doing weird stuff

Question

const allocation = [
   {partner: 3},
   {partner: 1},
   {partner: 2},
   {partner: 0},
   {partner: 4}
];

const rightallocation = new Array(5);
rightallocation.fill({number: 1});

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

   const rightIndex = allocation[i].partner;
   rightallocation[rightIndex].number = i;


   console.log("Filling "+ (i) + " into rightallocation["+ (allocation[i].partner)+"]");
   console.log(rightallocation[allocation[i].partner]);
}

console.log(rightallocation);

This code should take the array 'allocation' and mirror it. e.g. allocation[0] = 3, so rightallocation[3]= 0. All my logs inside the for give the correct numbers, but i get an array that is full of number:4 (last index)

here is the console log

heymoo · Accepted Answer · 2021-03-20T17:18:06.160

It's because the same object is being referenced 5 times in your rightallocation array.

So this line:

rightallocation[rightIndex].number = i;

Is changing .number for all elements in your array every time, because all elements are a reference to just the single {number : 1} object that you filled your rightallocation array with when you did this:

rightallocation.fill({number: 1})

Try changing these lines:

const rightallocation = new Array(5);
rightallocation.fill({number: 1});

To something like this:

const rightallocation = new Array(5).fill().map(u => ({number: 1}));

To make it clearer what happened, try filling your array with something more explicit like this. This will make sure that a new object is always created and you end up with five different objects in your array:

const rightallocation = [];

for (let i=0; i < 5; i++) {
  rightallocation.push({number: 1});
}

Also thanks your the explanation now i understand why it doesnt work — Feko Karels, Mar 20 '21 at 17:15
np, if you want to make it clearer for yourself what happened, try doing the alternate method I edited my answer to — heymoo, Mar 20 '21 at 17:17

JS Array of objects doing weird stuff

1 Answers1