Typescript: re-using properties from an interface in a class

Question

I'm experimenting with using a simple pattern for creating a type of 'value' object. To instantiate it, all properties should be specified in the constructor.

To avoid repeating the list of properties, I tried something like this:

interface Video {
    id: number;
    title: string;
}

class VideoCl implements Video {

    constructor(properties: Video) {
        for(const [k, v] of Object.entries(properties)) {
            this[k] = v;
        }
    }

}

Unfortunately, Typescript will not allow this as it requires all the properties from the interface to exist on the class as well.

Is there a simple way to accomplish this that removes the need for repeating the properties?

Declaration merging - make an interface of the same name as your class & extend the Video interface in it. — Gerrit0
– Gerrit0, Commented Mar 23, 2020 at 4:50
@Gerrit0 interfaces can have the same name as a class? This blows my mind. Would have made a few things I've been working on much simpler — Evert
– Evert, Commented Mar 23, 2020 at 5:04

Gerrit0 · Accepted Answer · 2020-03-24 00:01:36Z

1

You can accomplish this by using declaration merging with an interface of the same name. Keep in mind that by doing this you are effectively lying to TypeScript. Even if a property declared in the interface is missing, TypeScript won't care.

interface VideoCl extends Video { }

class VideoCl {
    constructor(properties: Video) {
        for(const [k, v] of Object.entries(properties)) {
            this[k] = v;
        }
    }
}

Related to this, iterating over properties with Object.entries, Object.keys, or directly setting values with Object.assign on a class is dangerous. TypeScript won't protect you from the following code.

const properties = { id: 1, title: '', func: null };
const cls = new VideoCl(properties);
cls.func(); // Runtime error

answered Mar 24, 2020 at 0:01

Gerrit0

9,3623 gold badges30 silver badges36 bronze badges

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

Collectives™ on Stack Overflow

Typescript: re-using properties from an interface in a class

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related