Set constructor in interface

Question

I have an interface and a class which implement it

export interface ITooltip {
    new(elem: HTMLElement, options?: ITooltipOptions);
    show(): void;
    hide(): void;
    toggle(): void;
}

export class Tooltip implements ITooltip {

    constructor(private  elem: HTMLElement, private options?: ITooltipOptions) {
    }

    ....
}

But in console I have an error:

Class 'Tooltip' incorrectly implements interface 'ITooltip'.
  Type 'Tooltip' provides no match for the signature 'new (elem: HTMLElement, options?: ITooltipOptions): any'

I don't understand why this error happens.

score 1 · Accepted Answer · answered Jun 27 '16 at 12:58

As far as I know you can not combine the interface which the class implements and the class constructor interface.

This works:

export interface ITooltip {
    show(): void;
    hide(): void;
    toggle(): void;
}

export type TooltipConstructor = { new(elem: HTMLElement, options?: ITooltipOptions): Tooltip };

export class Tooltip implements ITooltip {
    constructor(private  elem: HTMLElement, private options?: ITooltipOptions) {}

    show(): void {}
    hide(): void {}
    toggle(): void {}
}

(code in playground)

I think it's better solution. Thanks – Illorian Jun 28 '16 at 09:47 — Illorian, Jun 28 '16 at 09:47

score 0 · Answer 2 · answered Jun 27 '16 at 09:03

0

You have a couple of things in your code:

First in Typescript your class must provide all fields and functions defined in the interface. This can be sometimes tedious. If you want to avoid that and it doesn't break your structure you can use extends instead of implements and then you don't need to redefine everything

Second you don't declare a constructor declaration in the interface. So the new(.... sentence should be removed.

Your code will look something like this in the end:

export interface ITooltip {
    show(): void;
    hide(): void;
    toggle(): void;
}

export class Tooltip implements ITooltip {
    constructor(elem: HTMLElement, options?: ITooltipOptions) {}; 
    show(): void {};
    hide(): void {};
    toggle(): void {};           
}

Anyway I suggest you read the documentation of typescript first to understand these concepts

answered Jun 27 '16 at 09:03

iberbeu

15,295
5
27
48

That doesn't make much sense and is a global issue in OOP. Google it and you will find many solutions independent of the language – iberbeu Jun 27 '16 at 10:23
but I need declare in interface. That's my problem – Illorian Jun 27 '16 at 10:45
why? are you sure you need an interface? Do you know what an interface is? Your sw structure isn't good if you really need to declare a constructor in an interface – iberbeu Jun 27 '16 at 11:16
Why? Why in C# it's good but not in TS? I need that all classes which implement this interface, have the same constructor. – Illorian Jun 27 '16 at 11:28
well, I cannot say how it works in C# but in this post http://stackoverflow.com/questions/619856/interface-defining-a-constructor-signature you'll find a good debate on this issue. After reading a bit I guess you are not totally right saying that in C# it is not a problem at all – iberbeu Jun 27 '16 at 11:37
But I still have a question. How to set constructor in interface? – Illorian Jun 27 '16 at 11:42

Set constructor in interface

2 Answers2