Missing methods in TypeScript class

Question

I have a TypeScript model which contains properties and functions like:

class Person {
name: string
sayHello(){ console.log(name); }
}

When creating its instance I can make use of this sayHello() method as expected.

The problem comes when I store and get the object from the local storage or an external web service. While the properties are still present the methods have disappeared. (obviously because it’s just text).

Is there any way to restore the completeness of the object to be able to use its functions?

Or otherwise, is there any other technique? For instance, helper class that can work with type.

perhaps you are looking for something like stackoverflow.com/questions/36517173/… — Suraj Rao
– Suraj Rao, Commented Jul 13, 2018 at 13:05
for Titian answer below, Object assign does not deep copy items, is there a better way to bring back methods with something like lodash ngdeep? medium.com/better-programming/… — user12425844
– user12425844, Commented Mar 16, 2020 at 3:57

Kate Orlova · Accepted Answer · 2020-03-08 06:51:32Z

3

When you save to a local storage, you will save a JSON representation of the class data; when you get the object back from the local storage, it will be just an object, not an instance of the original class.

You can look for an external library that will help you with this, but the simple solution is to create a new instance of the class and assign the field values to the class using Object.assign:

class Person {
    public constructor(public name?: string){}
    sayHello() { console.log(name); }
}
let p = new Person("Test");
let data = JSON.stringify(p);
let p2 = new Person()
Object.assign(p2, JSON.parse(data));

edited Mar 8, 2020 at 6:51

Kate Orlova

3,3335 gold badges15 silver badges37 bronze badges

answered Jul 13, 2018 at 13:16

Titian Cernicova-Dragomir

253k37 gold badges464 silver badges394 bronze badges

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

1 Comment

user12425844 Over a year ago

hi, Object assign does not deep copy items, is there a better way to bring back methods with something like lodash ngdeep? medium.com/better-programming/…

Collectives™ on Stack Overflow

Missing methods in TypeScript class

1 Answer 1

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Linked

Related