Increase the range of numbers without being confined to a particular number

Question

Increase the range of numbers without being confined to a particular number

I may be asking a question that has already been answered, but I couldn't find the solution so here goes:

The workaround I have is not ideal because if I need to add more types, it will make upgrading difficult. Is there a better way to approach this?

declare const max: <A extends number | string> (a: A) => (b: A) => A

max(2)(3)     // Argument of type '3' is not assignable to parameter of type '2'
max('a')('b') // Argument of type '"b"' is not assignable to parameter of type '"a"'

// Possible workaround but will become clumsy if possible type to extends grow

declare const maxClumsy: {
    (a: number): (b: number) => number
    (a: string): (b: string) => string
}

maxClumsy(2)(3)
maxClumsy('a')('b')

playground link

typescript typescript-typings

Answer 1

Answer №1

When it comes to handling just two types, function overloads are the best approach in my opinion. Your declaration looks good:

declare const maxClumsy: {
    (a: number): (b: number) => number
    (a: string): (b: string) => string
}

If you're worried about repeating string and number, you can dynamically construct this type. Function overloads are essentially an intersection of function types, so by using a distributive conditional type and the UnionToIntersection helper from another Q&A on Stack Overflow, we can transform the union type string | number into the desired type:

type CurriedUnion<T> = T extends any ? (a: T) => (b: T) => T : never
type UnionToIntersection<T> = (T extends any ? (a: T) => void : never) extends (a: infer U) => void ? U : never
type CurriedOverload<T> = UnionToIntersection<CurriedUnion<T>>

Usage:

// type Test = ((a: string) => (b: string) => string) & ((a: number) => (b: number) => number)
type Test = CurriedOverload<string | number>

declare const coolMax: CurriedOverload<string | number>

// OK
coolMax (2) (3)
// OK
coolMax ('a') ('b')
// error
coolMax (2) ('b')
// error
coolMax ('a') (3)

Playground Link

Please note that distributing over union types like this may produce unexpected results when the input types themselves are unions; for example, since boolean is defined as the union type true | false, this method will not work as expected in that scenario.

Answer 2

When it comes to handling just two types, function overloads are the best approach in my opinion. Your declaration looks good:

declare const maxClumsy: {
    (a: number): (b: number) => number
    (a: string): (b: string) => string
}

If you're worried about repeating string and number, you can dynamically construct this type. Function overloads are essentially an intersection of function types, so by using a distributive conditional type and the UnionToIntersection helper from another Q&A on Stack Overflow, we can transform the union type string | number into the desired type:

type CurriedUnion<T> = T extends any ? (a: T) => (b: T) => T : never
type UnionToIntersection<T> = (T extends any ? (a: T) => void : never) extends (a: infer U) => void ? U : never
type CurriedOverload<T> = UnionToIntersection<CurriedUnion<T>>

Usage:

// type Test = ((a: string) => (b: string) => string) & ((a: number) => (b: number) => number)
type Test = CurriedOverload<string | number>

declare const coolMax: CurriedOverload<string | number>

// OK
coolMax (2) (3)
// OK
coolMax ('a') ('b')
// error
coolMax (2) ('b')
// error
coolMax ('a') (3)

Playground Link

Please note that distributing over union types like this may produce unexpected results when the input types themselves are unions; for example, since boolean is defined as the union type true | false, this method will not work as expected in that scenario.

Answer 3

Answer №2

Expanding on the point raised by @matt-diamond

Just remember that when you pass in literals, it can cause issues... If the variables are more broadly typed, you won't face this problem.

If you want to avoid explicitly passing typed variables each time, you can try this approach.

type Num = number | string
 
type AsNum<T> = T extends string ? string : 
   T extends number ? number : never 

declare const max: <T extends Num>(a: T) => (b: AsNum<T>) => AsNum<T>

max(2,4)  max('2','4') // This works fine
max(2,'4') // Results in an error: Argument of type 'string' is not assignable to parameter of type 'number'
max(true,false) // Results in an error: Argument of type 'boolean' is not assignable to parameter of type 'string | number'

While it may look a bit unwieldy like your initial suggestion, it offers a solution nonetheless.

Answer 4

Expanding on the point raised by @matt-diamond

Just remember that when you pass in literals, it can cause issues... If the variables are more broadly typed, you won't face this problem.

If you want to avoid explicitly passing typed variables each time, you can try this approach.

type Num = number | string
 
type AsNum<T> = T extends string ? string : 
   T extends number ? number : never 

declare const max: <T extends Num>(a: T) => (b: AsNum<T>) => AsNum<T>

max(2,4)  max('2','4') // This works fine
max(2,'4') // Results in an error: Argument of type 'string' is not assignable to parameter of type 'number'
max(true,false) // Results in an error: Argument of type 'boolean' is not assignable to parameter of type 'string | number'

While it may look a bit unwieldy like your initial suggestion, it offers a solution nonetheless.

Increase the range of numbers without being confined to a particular number

Answer №1

Answer №2

Similar questions

Tips for effectively deploying SvelteKit on a server without causing any disruptions to the user experience

accessing deeply nested JSON objects during the process of mapping data from an API request

Steps for verifying if an instance conforms to an interface

What is the best way to incorporate a type into this animation element?

Guide to implementing ion-toggle for notifications with Ionic 2 and Angular 2

How can I store the status of checked and unchecked checkboxes in an array of objects using Angular 7?

Unfortunately, I am unable to utilize my Async Validator as it is wrapped within the "__zone_symbol" object

Angular's Recursive Issue with the Execution Order of RxJS Observables

Geolocation plugin in Ionic encountered an issue: "Geolocation provider not found"

Using TypeScript to Add Items to a Sorted Set in Redis

What is the proper way to send a list as a parameter in a restangular post request

Can a standard tuple be matched with its corresponding key?

Best Practices for TypeScript and React: How to Handle Component State for Mounted Components

Is it possible for a TypeScript definition file to include a require statement?

When a React component in TypeScript is passed as a parameter and then assigned to a variable, an error with code TS2604 may occur stating that the JSX element type does not

Having trouble viewing the initial value in an AngularJS2 inputText field

Converting JSON into Typescript class within an Angular application

Tips on displaying just two buttons in one line

Using Firestore queries in your NodeJS application

What is the best way to implement the trackBy function in Angular 14 with strict-mode enabled?