0

While reading Angular's documentation about "Communicating with backend services using HTTP" I've encountered the following statement at the "Requesting a typed response" section:

...because the response is a plain object that cannot be automatically converted to an instance of a class

So, my question is what does it mean to convert plain object to an instance of a class?

3
  • Do you know what an instance of a class is? Commented Mar 14, 2021 at 9:11
  • @VLAZ, instance of a class is a JS object returned by a 'new' operator. Feel free to expound more, my friend. Commented Mar 14, 2021 at 9:17
  • That's basically it. With this definition, it should be clear what it means. A plain object is for example {}. Or { hello: "world" }. An object that is not of any class. Commented Mar 14, 2021 at 9:19

1 Answer 1

2

This is a plain object:

const object = {
    prop1: 'prop1',
    prop2: 'prop2'
};

Its type(and thus prototype) is Object.

On the other hand, we have a class(using TypeScript here):

class SpecificClass {
    prop1: string;
    prop2: string;
}

Its prototype is SpecificClass.

Even though they have the same signature(both have the same properties of the same type) you can't simply use the plain object as an instance of the class. This is due to the different prototype. In order to convert your plain object to a class instance, you'll have to create a new instance of the class(in our case SpecificClass) and copy all the properties from the plain object. That's basically it. The conversion would look something like:

const classInstance = new SpecificClass();
classInstance.prop1 = object.prop1;
classInstance.prop2 = object.prop2;

Now classInstance is an instance of the SpecificClass with the values of the plain object, so, in effect, you've converted the plain object to a class instance. The new operator basically creates a new object and assigns it's prototype to SpecificClass. Note that JSON to Class converters do exactly that under the hood.

In the docs they also mention:

Use an interface rather than a class, because the response is a plain object that cannot be automatically converted to an instance of a class.

In TypeScript, we can define interfaces:

interface ISpecificObject {
    prop1: string;
    prop2: string;
}

In TypeScript, they work a bit different from the high-level static typed compilation languages. They validate if an object is "an instance" of an interface by the so called Duck Typing. This means if both the object(no matter if it is plain or instance of class) and the interface have the same signature(methods and properties), then the object complies with the interface and we can use it as an "instance" of it. So, in this case we can say that we can pass the object variable where ISpecificObject is expected without any conversion.

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

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.