Describe function signature using an interface

Search Terms

function implements interface

Suggestion

Allow functions to indicate interfaces that they implement, allowing usage of a function interface.

Properties defined on an interface would not be possible unless they are defined as optional

Use Cases

When using function overloads, the return type is defined as any, this would allow the return type to be guarded and not use any. Referencing: https://www.typescriptlang.org/docs/handbook/functions.html#overloads

It would also allow optional properties to be defined on a function without doing type gymnastics.

Examples

interface CoolFunction {
  (first: string, second: number): number;
  (first: number, second: string): string;
  property?: boolean;
}

// args will be of type   [string, number] | [number, string]
function coolFunction(...args) implements CoolFunction {
  if (typeof args[0] === "string") {
    // We're now reduced our type of args to [string, number]
    return args[1];
  } else {
    // args can only be [number, string]
    return args[1];
  }
}

// This property is known as it is defined on the interface
coolFunction.property = true;

Checklist

My suggestion meets these guidelines:

• This wouldn’t be a breaking change in existing TypeScript/JavaScript code
• This wouldn’t change the runtime behavior of existing JavaScript code
• This could be implemented without emitting different JS based on the types of the expressions
• This isn’t a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, etc.)
• This feature would agree with the rest of TypeScript’s Design Goals.

[Eddie-CooRo]

I came across this problem back a while ago and after a little research I found this thread. I want to add that, this issue is super important when it comes to typing React components that have a generic type. because in that situation, there is no way to type the component using the arrow function + React.FC interface:

const MyComponent: FC<Props<T>> = <T>(props) => { ... }

(in the above example, we don’t have access to the function generic type at the point of declaring the MyComponent Type so the FC<Props<T>> errors)

So we have to use the function form, but by doing that, we won’t be able to use the FC interface anymore so we have to do this:

function <T>MyComponent(props: Parameters<FC<Props<T>>>[0]): ReturnType<FC<Props<T>>> { ... }

It isn’t that beautiful, but it wouldn’t matter if it worked. even with this syntax, we won’t get proper type check for things like Component.propTypes and Component.defaultProps. So we also have to add the definitions manually for each one of them (we can’t use the alias declaration trick in this case because that way there is no way to get the generic type).

So after all, it would be great if typescript had first-class support for this kind of situation. I’d love to be able to do something like this:

function <T>MyComponent(props) implements FC<Props<T>> {
  ...
}

[lifeiscontent]

@RyanCavanaugh any status update on this one?