Angular 4 instance variable changed with local variable

Question

When I change the isPublish property of localCampaign after copying the campaignData in that, the isPublish property of campaignData also get changed, "can see the comments in code below where this is happening"

export class CampaignNotificationDetailPage {
campaignData: any;

   publishCampaign() {
  let localCampaign = this.campaignData;
  localCampaign.isPublish = true;  //this also updates the this.campaignData.isPublish to true?
    }
   }

How to block the changes in campaignData and why this is happening?

Answer 1

object in javascript are reference type , so you must find a way to apply clone the object , this is one way to solve this :

export class CampaignNotificationDetailPage {
 campaignData: any;

    publishCampaign() {
    let localCampaign = object.assign({},this.campaignData);
    localCampaign.isPublish = true; 
    }
   }

another way :

export class CampaignNotificationDetailPage {
  campaignData: any;

       publishCampaign() {
       let localCampaign  {...this.campaignData}
       localCampaign.isPublish = true; 
        }
       }

this answer give a good explanation How to Deep clone in javascript