Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cloning a TypeScript Object

I have a typescript class

export class Restaurant {

  constructor ( private id: string, private name: string ) {

  }

  public getId() : string {
    return this.id;
  }

  public setId(_id : string) {
    this.id = _id;
  }

  public getName () {
    return this.name;
  }

  public setName ( _name:string ) {
    this.name = _name;
  }

}

I then have an instance of this class ( this is an example ):

restaurant:Restaurant = new Restaurant(1,"TestRest");

I then store this restaurant object in some sort of cache

cache.store( restaurant );

then later in my application I get the restaurant back

var restToEdit = cache.get( "1" );
restToEdit.setName( "NewName" );

But because of javascripts pass by reference on objects, the changes I make to restToEdit also get saved in the restaurant that is in the cache.

I basically want the restaurant in the cache to be a totally different instance to the restToEdit.

I have tried using jQuery.clone and extend, but it doesn't seem to work and I think this is because of it being a typescript object. Or will that not matter?

Any answers on how to clone this object would be appreciated

Thanks

like image 544
mwild Avatar asked Oct 03 '16 13:10

mwild


People also ask

How do you clone an object in TypeScript?

To create a deep copy of an object in TypeScript, install and use the lodash. clonedeep package. The cloneDeep method recursively clones a value and returns the result. The cloneDeep method returns an object of the correct type.

How do you create a new object from an existing object in TypeScript?

Object.create() The Object.create() method creates a new object, using an existing object as the prototype of the newly created object.


2 Answers

  • Using standard ES6 features

    const clone = Object.assign({}, myObject)
    

    Warning: this performs a shallow clone.

    This excellent page from MDN contains tons of details on cloning, including a polyfill for ES5

  • A "quick" way of deep cloning is to use JSON utilities

    const clone = JSON.parse(JSON.stringify(myObject))
    
  • A "proper" way of cloning is to implement a clone method or a copy constructor...

I know, I know, not enough JQuery

like image 59
Bruno Grieder Avatar answered Oct 03 '22 04:10

Bruno Grieder


This seems to work for me:

var newObject = Object.assign(Object.create(oldObj), oldObj)

Object.create creates a new instance with empty properties Object.assign then takes that new instance and assigns the properties

A more robust version of a clone function

    clone(obj) {
        if(Array.isArray(obj)) {
            return Array.from(obj);
        } else {
            return Object.assign(Object.create(obj), obj);
        }
    }
like image 39
Scot Avatar answered Oct 03 '22 05:10

Scot