Generate a map object by combining functions

Question

Generate a map object by combining functions

Currently, I am attempting to create a helper function that accepts an object of functions and wraps it in another function;

const bindFn = (obj, wrapFn) => Object.entries(obj).reduce((carry, [key, fn])=>{
carry[key] = ( ...args ) => wrapFn(fn.apply(null, args))
return carry;
},{})


// example of usage

const n = bindFn( { sum: (x) => x+1 }, console.log);
n.sum(3); // this should console.log 4

The issue is, I am unsure how to define the type for bindFn so that it returns the correct type that contains an object with the same keys and return types as the supplied object. Something like:

interface BindFn = {
[name: keyof obj] : () => ReturnType<obj[name]> :D !!! no clue.
}

typescript typescript-typings typescript-generics

Answer 1

Answer №1

Give this a shot:

const wrapFunctions = <T extends {[key: string]: Function}>(
  obj: T,
  wrapperFn: Function
) => {
  return Object.entries(obj).reduce((accumulator, [key, fn]) => {
    accumulator[key] = (...args) => wrapperFn(fn.apply(null, args));
    return accumulator;
  }, {}) as T;
};

const n = wrapFunctions({ sum: (x: number) => x + 1 }, console.log);
n.sum(3);
n.sum('3'); // error: type string does not match number
n.foo(2);   // error: 'foo' is not in the structure defined by wrapFunctions
const z = wrapFunctions('foo', console.log); // error: incorrect parameter shape for wrapFunctions

This approach provides valuable type checking as the output type of wrapFunctions() will match the format of its first input. For example, n.sum() will have the type (x: number) => x + 1 because that was the initial value passed to wrapFunctions() (due to the use of return ... as T)

https://i.sstatic.net/1L3yM.png

Furthermore, it enforces that the primary parameter of wrapFunctions() must be an object with keys representing functions (via

T extends {[key: string]: Function}

)

https://i.sstatic.net/nBx8M.png

Answer 2

Give this a shot:

const wrapFunctions = <T extends {[key: string]: Function}>(
  obj: T,
  wrapperFn: Function
) => {
  return Object.entries(obj).reduce((accumulator, [key, fn]) => {
    accumulator[key] = (...args) => wrapperFn(fn.apply(null, args));
    return accumulator;
  }, {}) as T;
};

const n = wrapFunctions({ sum: (x: number) => x + 1 }, console.log);
n.sum(3);
n.sum('3'); // error: type string does not match number
n.foo(2);   // error: 'foo' is not in the structure defined by wrapFunctions
const z = wrapFunctions('foo', console.log); // error: incorrect parameter shape for wrapFunctions

This approach provides valuable type checking as the output type of wrapFunctions() will match the format of its first input. For example, n.sum() will have the type (x: number) => x + 1 because that was the initial value passed to wrapFunctions() (due to the use of return ... as T)

https://i.sstatic.net/1L3yM.png

Furthermore, it enforces that the primary parameter of wrapFunctions() must be an object with keys representing functions (via

T extends {[key: string]: Function}

)

https://i.sstatic.net/nBx8M.png

Answer 3

Answer №2

Do you think this is what you're looking for? I believe this is correct.

const bindFunction = <A extends keyof any, B>(obj: Record<A, B>, wrapperFunction: (func: (arg: B) => B) => any): typeof obj => Object.entries(obj).reduce((accumulator, [key, func])=>{
    accumulator[key] = ( ...args: any[] ) => wrapperFunction(func.apply(null, args))
    return accumulator;
}, {})

const object = { name: () => "my name is", age: () => "my age is" };
const result = bindFunction(object, (argument) => {
    console.log("executed on");
    return argument;
})

Alternatively, here is the version with the executed function:

const bindFunction = <A extends keyof any, B , C>(obj: Record<A, B>, wrapperFunction: (func: (arg: B) => any) => C): Record<A, C> => Object.entries(obj).reduce((accumulator, [key, func])=>{
    accumulator[key] = ( ...args: any[] ) => wrapperFunction(func.apply(null, args))
    return accumulator;
}, {})

const object = { name: () => "my name is", age: () => "my age is" };
const result = bindFunction(object, (argument) => {
    console.log("executed on");
    return 5;
}) // {name: number, age: number}

Answer 4

Do you think this is what you're looking for? I believe this is correct.

const bindFunction = <A extends keyof any, B>(obj: Record<A, B>, wrapperFunction: (func: (arg: B) => B) => any): typeof obj => Object.entries(obj).reduce((accumulator, [key, func])=>{
    accumulator[key] = ( ...args: any[] ) => wrapperFunction(func.apply(null, args))
    return accumulator;
}, {})

const object = { name: () => "my name is", age: () => "my age is" };
const result = bindFunction(object, (argument) => {
    console.log("executed on");
    return argument;
})

Alternatively, here is the version with the executed function:

const bindFunction = <A extends keyof any, B , C>(obj: Record<A, B>, wrapperFunction: (func: (arg: B) => any) => C): Record<A, C> => Object.entries(obj).reduce((accumulator, [key, func])=>{
    accumulator[key] = ( ...args: any[] ) => wrapperFunction(func.apply(null, args))
    return accumulator;
}, {})

const object = { name: () => "my name is", age: () => "my age is" };
const result = bindFunction(object, (argument) => {
    console.log("executed on");
    return 5;
}) // {name: number, age: number}

Generate a map object by combining functions

Answer №1

Answer №2

Similar questions

Creating a custom type declaration for .lottie files in Next.js

The module '@ngmodule/material-carousel' could not be located

Build for Node.js using TypeScript with full functionality

Node JS application facing compatibility issues with Typescript not working as intended

Using two indexes in ngFor can result in unexpected changes to the values being displayed

Choosing the correct key and handling parsing errors

Tips for incorporating null checks into a function in TypeScript

Using the spread operator in React to distribute JSX elements within a map function

How can RxJS be used to handle only the first value returned when calling multiple URLs?

Display a loading spinner while the search bar makes an API request in Angular

The TypeScript error is causing issues in the Express router file

Discover the power of Angular2 by utilizing local template variables for efficient element management within a list

What is the method for verifying the types of parameters in a function?

Issues with the typings for the toPromise function in WebStorm have been identified

Display and conceal multiple div elements using Angular 2/Typescript after a brief delay

Looking to retrieve the request body in a route handler in Next.js version 13.2?

Finding the final day of a specific year using the moment library

The ViewChild from NgbModalModule in @ng-bootstrap/ng-bootstrap for Angular 6 is causing the modal to return as

"An auto-invoking function is declared in a TypeScript compiled module with a var statement

Filtering an array using criteria: A step-by-step guide