Typescript Function Interface overloading

Question

I have the following code.

interface MySecondInterface<A>{
    type: A;
}

interface MyInterface {
    (val1:string, val2:string): MySecondInterface<string>;
    (): MySecondInterface<string>;
}

const myInterfaceFn: MyInterface = (value1: string, value2:string) => {
    return {
        type: value1 + value2
    };
}



const myInterfaceFn2: MyInterface = () => {
    return {
        type: "Text"
    };
}

You can find the code here . I am getting error

Type '(value: string) => { type: string; }' is not assignable to type 'MyInterface'.

How will I create the interface to support both method signatures?

Basically, an interface for a function that takes either 2 arguments or no arguments. How can I do that?

Answer 1

What about using type instead of interface ?

interface MySecondInterface<A>{
  type: A;
}

type MyInterface = ((val1: string, val2: string) => MySecondInterface<string>) | (() => MySecondInterface<string>);

const myInterfaceFn: MyInterface = (value1: string, value2:string) => {
  return {
    type: value1 + value2
  };
}

const myInterfaceFn2: MyInterface = () => {
  return {
    type: "Text"
  };
}

Answer 2

I am not quite sure why TypeScript is ok with your interface declaration, because the two signatures have nothing in common. Maybe this is due to the fact how TypeScript handles function signatures (see sidenote below).

In your case, I would suggest

• make the value optional or
• create one function and use overloading, eg

---

interface Result {
    type: string;
}

function myFn();
function myFn(val?: string):Result {
    if (!val) { return { type: 'foo' }; }
    return { type: val };
}

---

Sidenote: TypeScript is a little bit weird when it comes to call signatures. I guess this is due to the fact that it wants to be a superset of JavaScript. The following snippets illustrates this:

interface Fn {
    (a: string): string;
}

const f1: Fn = () => 'hi';
const f2: Fn = (a: string) => a;

f1();       // Supplied parameters do not match any signature of call target.
f1('a');    // OK, even though `f1` has no explicit argument...
f2('asd');  // OK

Answer 3

Focus in on your error

Type '(value: string) => { type: string; }' is not assignable to type 'MyInterface'.

MyInterface instances must be allowed to take 0 arguments. So the following errors:

const myInterfaceFn: MyInterface = (value1: string, value2:string) => {
    return {
        type: value1 + value2
    };
}

But if you mark both as optional (eg using default parameters) the error goes away:

const myInterfaceFn: MyInterface = (value1 = '', value2 = '') => {
    return {
        type: value1 + value2
    };
}

Answer 4

Your myInterfaceFn has to satisfy both function definitions in MyInterface .

The following code works fine!

interface MySecondInterface<A>{
    type: A;
}

interface MyInterface {
    (val1:string, val2:string): MySecondInterface<string>;
    (): MySecondInterface<string>;
}

const myInterfaceFn: MyInterface = (value1: string = undefined, value2:string = undefined) => {
    return {
        type: value1 !== undefined && value2 !== undefined
            ? value1 + value2
            : "Text"
    };
}



const myInterfaceFn3: MyInterface = () => {
    return {
        type: "Text"
    };
}