Function Type Mapping

Question

Function Type Mapping

I am in the process of creating a function type that is based on an existing utility type defining a mapping between keys and types:

type TypeMap = {
    a: A;
    b: B;
}

The goal is to construct a multi-signature function type where the key is used as a literal string in the first parameter:

type Result = {
    (key: "a"): A;
    (key: "b"): B;
}

Is it feasible to achieve this in TypeScript? I'm aware that function types and mapped types may not always work well together.

I can attempt the following approach, but it involves repeating the full list of keys which I'd like to avoid:

type TempFunc<K extends keyof TypeMap> = {
    (key: K): TypeMap[K];
};

type Result = TempFunc<"a"> & TempFunc<"b">;

Note: This example is simplified; my actual TypeMap comprises over 100 keys.

typescript

Answer 1

Answer №1

TypeScript defines a function with multiple call signatures (referred to as an overloaded function) as an intersection of these signatures. In other words:

type Result = {
    (key: "a"): A;
    (key: "b"): B;
};

is equivalent to

type Result = { (key: "a"): A; } & { (key: "b"): B; };

which is also equivalent to

type Result = ((key: "a") => A) & ((key: "b") => B);

This can be confirmed by testing the code below using any of those Result definitions:

declare const r: Result;
const a = r("a");
// const a: A
const b = r("b");
// const b: B

Therefore, if we can produce an intersection programmatically, it will fulfill your requirement.

Fortunately, this can be achieved through a conditional type inference method involving type parameters in a contravariant position. This approach uses features detailed in the answers to questions such as Transform union type to intersection type and considers it as a distributive object type as mentioned in ms/TS#47109.

It may not always be necessary to have multiple call signatures depending on the scenario. If each call signature maps input to output in a similar fashion by indexing into TypeMap, a single generic call signature could serve a comparable purpose:

type Result = <K extends keyof TypeMap>(key: K) => TypeMap[K];

This alternative method is simpler than the previous contravariant object concept and behaves similarly when tested as shown above.

If multiple distinct call signatures are not essential for your use case, utilizing generics might be a more straightforward approach.

Link to Playground for Code Testing

Answer 2

TypeScript defines a function with multiple call signatures (referred to as an overloaded function) as an intersection of these signatures. In other words:

type Result = {
    (key: "a"): A;
    (key: "b"): B;
};

is equivalent to

type Result = { (key: "a"): A; } & { (key: "b"): B; };

which is also equivalent to

type Result = ((key: "a") => A) & ((key: "b") => B);

This can be confirmed by testing the code below using any of those Result definitions:

declare const r: Result;
const a = r("a");
// const a: A
const b = r("b");
// const b: B

Therefore, if we can produce an intersection programmatically, it will fulfill your requirement.

Fortunately, this can be achieved through a conditional type inference method involving type parameters in a contravariant position. This approach uses features detailed in the answers to questions such as Transform union type to intersection type and considers it as a distributive object type as mentioned in ms/TS#47109.

It may not always be necessary to have multiple call signatures depending on the scenario. If each call signature maps input to output in a similar fashion by indexing into TypeMap, a single generic call signature could serve a comparable purpose:

type Result = <K extends keyof TypeMap>(key: K) => TypeMap[K];

This alternative method is simpler than the previous contravariant object concept and behaves similarly when tested as shown above.

If multiple distinct call signatures are not essential for your use case, utilizing generics might be a more straightforward approach.

Link to Playground for Code Testing

Function Type Mapping

Answer №1

Similar questions

Tips for triggering useEffect just once when various dependencies are updated simultaneously

Unlocking the Potential of Vue Class Components: Exploring Advanced Customization Options

Creating a List programatically in material-ui can be easily achieved by following these steps

Troubleshooting the problem of redirecting a website to www on IIS 10 (Windows Server 2019)

Discussing recursive types A <--> B with generics in TypeScript

The express application's GET route is causing a "Cannot GET" error to be thrown

Tips for refreshing the appearance of a window in angular when it is resized

Obtain unfinished designs from resolver using GraphQL Code Generator

The module "node_modules/puppeteer/lib/types" does not contain the export "Cookie"

Yup will throw an error if both a minimum value is set and the field is also marked

Utilizing Protractor, TypeScript, and Jasmine for Automated Testing

The shape-matching subset functionality in Typescript is experiencing issues

The communication between Angular and Unity using SignalR for messaging is not functioning properly, as I am unable to

Unknown error occurred in Eventstore: Unable to identify the BadRequest issue

Next.js experiencing hydration error due to dynamic component

Transferring functionality from a child component to a parent component

The type 'HttpEvent<MovieResponse>' does not contain a property named 'results'. This is causing a TypeScript Error

The error message "Type 'Dispatch<SetStateAction<undefined>>' cannot be assigned to type 'Dispatch<SetStateAction<MyType | undefined>>'" appears in the code

The functionality of TypeScript's instanceof operator may fail when the method argument is not a simple object

Using a for-loop in Typescript to iterate over objects in an array