Maintaining type information while iterating over an object with Typescript

Question

Maintaining type information while iterating over an object with Typescript

I am faced with the challenge of wrapping functions within an object in order to use their return values, all without altering their signature or losing type information.

// An object containing various functions
const functions = { foo, bar, baz }

// Example wrapper function
const doSomething: (result: any) => void;

// Function to wrap each individual function
function wrapper<P extends any[]>(fn: (...params: P) => any) {
    return (...params: P) => doSomething(fn(...params));
}

// The main wrap function which preserves type information
function wrap(functions) {
    const wrapped = {};

    for (const key in functions) {
        wrapped[key] = wrapper(functions[key]);
    }

    return wrapped;
}

const wrapped = wrap(functions);

// How can we retain type information for wrapped and its functions?

Is it a feasible task to maintain type information (including list of functions and their parameters) while wrapping these functions?

typescript typescript-generics

Answer 1

Answer №1

If you're working with TypeScript, you won't get automatic inference for higher-order type operations; you'll need to provide annotations and assertions in certain places. When you check the type of wrapper, you'll see:

/* function wrapper<P extends any[]>(fn: (...params: P) => any): (...params: P) => void */

This means that it returns a function whose parameters mirror those of the input function but has a return type of void. For this scenario, crafting the wrap() function would look something like this:

function wrap<T extends Record<keyof T, (...args: any) => any>>(functions: T) {
    const wrapped = {} as { [K in keyof T]: (...p: Parameters<T[K]>) => void };
    for (const key in functions) {
        wrapped[key] = wrapper(functions[key]);
    }
    return wrapped;
}

The argument functions is of generic type T restricted to an object type with properties as functions. The return wrapped is confirmed to be of a mapped type that mirrors the properties of T, where the function types' return values are changed to void. This setup utilizes the Parameters utility type to specify that the output functions take the same parameters as the input functions.

For thoroughness, here are the sample definitions I'm using:

const functions = {
    foo: (x: string) => x.length,
    bar: (x: number) => x.toFixed(2),
    baz: (x: boolean, y: boolean) => x && y;
}

const doSomething = (result: any) => { console.log(result) };

Upon calling wrap(), we observe the following outcomes:

const wrapped = wrap(functions);
wrapped.foo("hey"); // 3
wrapped.bar(Math.PI); // 3.14
wrapped.baz(true, false); // false

If there's an incorrect usage, the compiler will raise errors, such as:

wrapped.foo(true); // error! boolean is not a string
wrapped.foo("string", false); // error! expected 1 argument, received 2

Seems like it aligns with what you're looking for, right?

Visit the Playground for Interactive Coding

Answer 2

If you're working with TypeScript, you won't get automatic inference for higher-order type operations; you'll need to provide annotations and assertions in certain places. When you check the type of wrapper, you'll see:

/* function wrapper<P extends any[]>(fn: (...params: P) => any): (...params: P) => void */

This means that it returns a function whose parameters mirror those of the input function but has a return type of void. For this scenario, crafting the wrap() function would look something like this:

function wrap<T extends Record<keyof T, (...args: any) => any>>(functions: T) {
    const wrapped = {} as { [K in keyof T]: (...p: Parameters<T[K]>) => void };
    for (const key in functions) {
        wrapped[key] = wrapper(functions[key]);
    }
    return wrapped;
}

The argument functions is of generic type T restricted to an object type with properties as functions. The return wrapped is confirmed to be of a mapped type that mirrors the properties of T, where the function types' return values are changed to void. This setup utilizes the Parameters utility type to specify that the output functions take the same parameters as the input functions.

For thoroughness, here are the sample definitions I'm using:

const functions = {
    foo: (x: string) => x.length,
    bar: (x: number) => x.toFixed(2),
    baz: (x: boolean, y: boolean) => x && y;
}

const doSomething = (result: any) => { console.log(result) };

Upon calling wrap(), we observe the following outcomes:

const wrapped = wrap(functions);
wrapped.foo("hey"); // 3
wrapped.bar(Math.PI); // 3.14
wrapped.baz(true, false); // false

If there's an incorrect usage, the compiler will raise errors, such as:

wrapped.foo(true); // error! boolean is not a string
wrapped.foo("string", false); // error! expected 1 argument, received 2

Seems like it aligns with what you're looking for, right?

Visit the Playground for Interactive Coding

Answer 3

Answer №2

Thanks to the guidance provided by jcalz's solution, I was able to create a more versatile function objects mapper.

This function wraps each function within an object with a specified function, while preserving the original type signature of the object.

function mapFunctionsObj<T extends Record<keyof T, (...p: any[]) => any>>(
    fn: <X>(result: X) => X,
    functions: T
) {
    const mapped = {} as any;
    for (const key in functions) {
        mapped[key] = (...params) => fn(functions[key](...params));
    }
    return mapped as { [K in keyof T]: (...p: Parameters<T[K]>) => ReturnType<T[K]> };
}

For further insight into the typings used, please refer to the original answer.

Answer 4

Thanks to the guidance provided by jcalz's solution, I was able to create a more versatile function objects mapper.

This function wraps each function within an object with a specified function, while preserving the original type signature of the object.

function mapFunctionsObj<T extends Record<keyof T, (...p: any[]) => any>>(
    fn: <X>(result: X) => X,
    functions: T
) {
    const mapped = {} as any;
    for (const key in functions) {
        mapped[key] = (...params) => fn(functions[key](...params));
    }
    return mapped as { [K in keyof T]: (...p: Parameters<T[K]>) => ReturnType<T[K]> };
}

For further insight into the typings used, please refer to the original answer.

Maintaining type information while iterating over an object with Typescript

Answer №1

Answer №2

Similar questions

Encountering the issue "ReferenceError: Unable to reach 'Base' before initialization" while testing a Next.js web application on a local server

Issues have been reported regarding the paramMap item consistently returning null when working with Angular 8 routing

Using TypeScript to define task invocation parameters with AWS CDK's CfnMaintenanceWindowTask

Is there a way to specifically target the MUI paper component within the select style without relying on the SX props?

What benefits does Observable provide compared to a standard Array?

The validation for the email field in Bootstrap, specifically in Angular 5, is not functioning properly for the "Email is Required

What are the steps to view output on VS Code using Typescript?

Attempt the HTTP request again only for specific status codes

Encountering difficulty retrieving host component within a directive while working with Angular 12

Recording attributes in a React component with Typescript

Struggling to update TypeScript and encountering the error message "Unable to establish the authenticity of host 'github.com (192.30.253.113)'"

Despite EsLint and Prettier's efforts to improve code quality, users are experiencing frequent unnecessary errors and unexpected auto-insertion of parentheses at

implementing firestore onsnapshotListner feature with pagination

Guide to encapsulating a container within a map function using a condition in JSX and TypeScript

Unveiling individual modules of an Angular library using public-api.ts in the latest version of Angular (Angular 13)

Retrieving an Observable within an Observable is a feature found in Angular 9

Adding an object with a composite key to an IndexedDB object store is not permitted as the key already exists within the store. This limitation occurs when attempting to add an entry

The data type does not match the expected type 'GetVerificationKey' in the context of express-jwt when using auth0

Unable to complete plugin registration due to a "handler missing or undefined" error

At what point do we employ providers within Angular 2?