How can we recursively expand a function type in TypeScript?

Question

How can we recursively expand a function type in TypeScript?

Consider this scenario with the type I:

type I = () => () => () => "a" | "b" | "c";

How can we define a new generic type Unwrap in such a way that Unwrap<I> results in

"a" | "b" | "c"

?

type I = () => () => () => "a" | "b" | "c";

type Result = Unwrap<I>; // "a" | "b" | "c"

The code snippet below causes a circularity error:

type Unwrap<
  T extends (...args: any[]) => any,
  R = ReturnType<T>
> = R extends (...args: any[]) => any
  ? Unwrap<R>
  : R;

Any assistance on resolving this issue would be highly appreciated. Thank you!

typescript types compiler-errors unwrap type-inference

Answer 1

Answer №1

Here is a clever workaround for TypeScript 3 that surprisingly isn't terrible.

type I = () => (() => (() => "a" | "b" | "c")) | "e" | (() => "f" | "g");

type Unwrap<T> =
    T extends (...args: any[]) => infer R
        ? { 0: Unwrap<R> }[T extends any ? 0 : never] // Tricky way to iterate.
    : T;

type Result = Unwrap<I>;
// type Result = "e" | "a" | "b" | "c" | "f" | "g";

Check it out on the Playground!

Answer 2

Here is a clever workaround for TypeScript 3 that surprisingly isn't terrible.

type I = () => (() => (() => "a" | "b" | "c")) | "e" | (() => "f" | "g");

type Unwrap<T> =
    T extends (...args: any[]) => infer R
        ? { 0: Unwrap<R> }[T extends any ? 0 : never] // Tricky way to iterate.
    : T;

type Result = Unwrap<I>;
// type Result = "e" | "a" | "b" | "c" | "f" | "g";

Check it out on the Playground!

Answer 3

Answer №2

Referring back to the earlier comment, it is important to note that the Unwrap type is functional in TypeScript 4.1 (which is on the horizon for release).

Answer 4

Referring back to the earlier comment, it is important to note that the Unwrap type is functional in TypeScript 4.1 (which is on the horizon for release).

How can we recursively expand a function type in TypeScript?

Answer №1

Answer №2

Similar questions

Combining React Context and Typescript using a Custom Hook

Issue with TypeORM: The database table is not being created during migration execution in the SQLITE environment

injectIntl requires a component with props containing the `intl` attribute

How do I make functions from a specific namespace in a handwritten d.ts file accessible at the module root level?

What is the reason behind TypeScript not narrowing types with control flow and never in the case of arrow functions?

Encountering the issue: "Property '...' is not found on the type 'typeof "...."'"

The specified type '{ file: ArrayBuffer; url: string; }' cannot be assigned to type '{ file: Blob; url: string; }'

Creating a custom Angular pipe to convert milliseconds to a formatted hh:mm:ss in Angular

Is it possible to capture and generate an AxiosPromise inside a function?

Differentiating Angular HTML and script code is a fundamental practice in Angular development

Angular 9: The Ultimate Interceptor

JavaScript: How to clear an array after using a forEach loop

Determining the instance type of a TypeScript singleton class

The type 'string | null' cannot be assigned to the type 'string | undefined'. Specifically, the type 'null' cannot be assigned to the type 'string | undefined'

When ts-loader is used to import .json files, the declaration files are outputted into a separate

Repeated declaration of TypeScript interface identifier

The JSX component in next.js cannot be utilized as a user component

Guide on displaying information on a pie chart in Angular 2 using ng2-charts

How can TypeScript be used to access a state object conditionally using an array?

The impact of placing a method in the constructor versus outside it within a class (yielding identical outcomes)