Javascript - Adding unique item to array in loop but array keeps repeating values

Question

I have an empty array which i try to add unique objects (checkedAccounts) in a for loop. I log the unique objects in a console so i can confirm they are all unique. funny thing is, after the loop my array repeats the same value of the last index.

So in a case of adding [1,2,3] to the empty array inside a for loop, instead of getting [1,2,3] i get [3,3,3]

find below my 2 different approaches that didnt work

//Approach 1

let finalAccounts:any[] = [];
let item:any = this.productModel;

let i:number = 0;

  for(i = 0; i < checkedAccounts.length; i++){
    item.accountNo = checkedAccounts[i].accountNo;
    item.accountName = checkedAccounts[i].accountName;
    item.accountType = checkedAccounts[i].accountType;
    finalAccounts[i] = item;
    console.log('item in loop ' + i, item);
    console.log('Final acounts in loop ' + i, finalAccounts);
  }

  console.log('Final Accounts', finalAccounts);





  //Approach 2

  let finalAccounts:any[] = [];
  let item:any = this.productModel;

  for(let account of checkedAccounts){
    temp.accountNo = account.accountNo;
    temp.accountName = account.accountName;
    temp.accountType = account.accountType;
    finalAccounts.push(temp);
    console.log('temp'+checkedAccounts.indexOf(account),temp);
  }

simple initialise let item:any = this.productModel; inside for loop which solves your issue . you cant share instance — super cool
– super cool, Commented Nov 6, 2018 at 7:42

user184994 · Accepted Answer · 2018-11-06 07:51:19Z

1

You need to ensure that you have a fresh copy of the item in each loop iteration. Using the syntax below, we can create a shallow copy. Try this:

for(i = 0; i < checkedAccounts.length; i++){
    let item:any = {...this.productModel};
    item.accountNo = checkedAccounts[i].accountNo;
    finalAccounts.push(item);
}

answered Nov 6, 2018 at 7:51

user184994

18.3k2 gold badges51 silver badges54 bronze badges

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

3 Comments

Ab Ebube Over a year ago

let me try this

Ab Ebube Over a year ago

THIS WORKS! Thank you! @user184994

user184994 Over a year ago

@AbEbube Glad to help. If you get a minute, feel free to accept the answer using the green tick

super cool · Accepted Answer · 2018-11-06 11:14:15Z

0

you can't share instance inside foreach while you push to a array i.e make it independent.

couple of observations

1) If you want to use any(strictly avoid, use it only if you are not sure about type) then there is no point using let item:any = {...this.productModel} you can simply achive same using let item:any = {}

2) preferable way will be typeScript way using interfaces

Code:

finalAccounts: IntTest[] = [];

export interface productModel {
  accountNo: string;
  address?: string;
}

for (i = 0; i < checkedAccounts.length; i++) {
  let item: IntTest = {
    accountNo: checkedAccounts[i].accountNo
  };
  finalAccounts.push(item);
}

edited Nov 6, 2018 at 11:14

answered Nov 6, 2018 at 7:45

super cool

6,0653 gold badges34 silver badges67 bronze badges

3 Comments

sertsedat Over a year ago

Better to shallow copy the productmodel

user184994 Over a year ago

This isn't going to be any better, as it's still setting item to the same object on each iteration

super cool Over a year ago

@AbEbube updated answer for info . hope it helps to understand better.

Collectives™ on Stack Overflow

Javascript - Adding unique item to array in loop but array keeps repeating values

2 Answers 2

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related