How do I backup or clone a typescript array by value

Question

1.00/5 (1 vote)

See more:

NOTE: This is the original text of the question posted here and on StackOverflow. The problem turned out to be completely different - I have posted my findings as a solution

I have tried all the examples listed here, and no matter which one I take including the JSON parse / stringify, when I modify an element in the original array, it is automatically reflected in the backup as is the case in a copy by reference. I need to find a way to break the link and reliably back up by value.

What I have tried:

Each of these in turn with no luck.

this.backupPersons = JSON.parse(JSON.stringify(this.persons));

this.backupPersons = this.persons.slice(0);

this.backupPersons = this.persons.concat();

this.backupPersons.concat(this.persons);

this.backupPersons = angular.copy(this.persons);

for (var i in this.persons) {
    this.backupPersons.concat(this.persons[i]);
}

this.persons.forEach(function (arrayItem) {
    this.backupPersons.concat(arrayItem);
});

for (const element of this.persons) {
    this.backupPersons.push(element);
  }

Dont even get me started on StackOverflow...

Posted 19-Jan-22 21:09pm

Ger Hayden

Updated 19-Jan-22 23:31pm

v2

Add a Solution

Comments

Richard Deeming 20-Jan-22 4:14am

You provided significantly less information here than you did in your StackOverflow question[^]; and there wasn't enough information in your StackOverflow question for anyone else to be able to diagnose the problem.

Look at both questions again, remembering that nobody else can see the rest of your code. Do you think there's enough information there for anyone to arrive at the solution you've posted below?

Ger Hayden 20-Jan-22 5:34am

Apologies Richard, the day job is interfering! Both texts were identical to start with. SO nuked it in minutes which is why it is now so different. I did add a brief summary as a solution here - I have since put a note at the top of the original question here and posted the revised code in solution 1. There is still a problem, just not the one I sought help for. I would like to leave it as is here, because I am confident that others will fall into the same trap.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Ger Hayden · Accepted Answer · 2022-01-19T21:53:00

The problem is not

this.backupPersons = JSON.parse(JSON.stringify(this.persons));

Its that angular keeps calling the backup method so that when I come to use it, the backup has been overwritten to reflect the the changes to the original making it useless unless I can limit how many calls angular makes!

I discovered this when I modified the method responsible as follows:

private makeBackup()
{
    this.deletedPersons = new Array<PersonMasterBase>();
    this.backupPersons = new Array<PersonMasterBase>();

    this.backupPersons = JSON.parse(JSON.stringify(this.persons));
    console.log(this.persons[1].p_Address1);
    console.log(this.backupPersons[1].p_Address1);

    this.backupPersons[1].p_Address1 = "New Value";

    console.log(this.persons[1].p_Address1);
    console.log(this.backupPersons[1].p_Address1);


}

The logged information showed that firstly, the stringify was doing its job, and more importantly that the module call was being repeated many many times, each one making a fresh backup so that time I needed the backup it had the same information as the original. The the problem as reported was completely mis leading.