How to remove a value and key without affecting the original array?

Question

When I run the code below, the listData (original data sources) will also be affected.

How can I improve my code so that downloadData can copy the data from listData and remove the id, createdBy, create_at, updatedBy and updated_at in the array but listData's data is being kept and not being altered?

let downloadData = this.listData.filteredData;

let downloadDataNum = downloadData.length;

for( let i = 0; i < downloadDataNum; i++ ) {
  delete downloadData[i].id;
  delete downloadData[i].createdBy;
  delete downloadData[i].created_at;
  delete downloadData[i].updatedBy;
  delete downloadData[i].updated_at;
}

Answer 1

 let downloadData = [...this.listData.filteredData];

for( let i = 0; i < downloadData.length; i++ ) {
  delete downloadData[i].id;
  delete downloadData[i].createdBy;
  delete downloadData[i].created_at;
  delete downloadData[i].updatedBy;
  delete downloadData[i].updated_at;
}

you can try this... using spread operator you can spread the data to downloadData variable without mutating listData

Answer 2

You can try like this by using "..." deep copy

let downloadData = [...this.listData.filteredData];

let downloadDataNum = downloadData.length;

for( let i = 0; i < downloadDataNum; i++ ) {
  delete downloadData[i].id;
  delete downloadData[i].createdBy;
  delete downloadData[i].created_at;
  delete downloadData[i].updatedBy;
  delete downloadData[i].updated_at;
}

let me know if it working or not.

Answer 3

You have to make a copy of the original data.

You can do this several ways:

// Way 1
let downloadData = Array.from(this.listData.filteredData);

// Way 2
let downloadData = JSON.parse(JSON.stringify(this.listData.filteredData));

// Way 3 (using spread operator)
let downloadData = [...this.listData.filteredData];

// Way 4
let downloadData = this.listData.filteredData.slice(0);

Then any modifications you add to downloadData won't affect the original data.

Answer 4

You should make a copy of the original data using JSON.stringify() and JSON.parse()

let downloadData = JSON.parse(JSON.stringify(this.listData.filteredData));

Also you can simplify your code using array of keys are forEach

let keys = ['id','createdBy','created_at','updatedBy','updated_at'];
downloadDataNum.forEach(x => {
     keys.forEach(key => delete x[key]);
})

Using map() and reduce()

You can use map() on the original array and return new array which contains desired properties

let keys = ['id','createdBy','created_at','updatedBy','updated_at'];
let downloadData = this.listData.filteredData.map(x => {
     return keys.reduce((ac,a) => (ac[a] = x[a],ac),{})
});

Answer 5

Simply clone the array before editing it, as Arrays are copied by reference:

let downloadData = this.listData.filteredData;

// Clone the array
let cloneDownloadData = downloadData.slice(0);

let downloadDataNum = cloneDownloadData.length;

for( let i = 0; i < downloadDataNum; i++ ) {
  delete cloneDownloadData[i].id;
  delete cloneDownloadData[i].createdBy;
  delete cloneDownloadData[i].created_at;
  delete cloneDownloadData[i].updatedBy;
  delete dcloneDownloadData[i].updated_at;
}