Using String Literal Types in a generic function in TypeScript

Question

Using String Literal Types in a generic function in TypeScript

Currently, I have a function with one generic parameter and two function parameters. When utilizing "String Literal Type," the two function parameters can have different values:

function func2<T extends 'A' | 'B'>(x: T, y: T): void { }

func2('A', 'A'); // OK
func2('A', 'B'); // OK, why?
func2('A', 'C'); // ERR

However, I require that both x and y to be the same, similar to the example shown with classes:

class A {  public a;}
class B {  public b;}
class C {  public c;}

function func1<T extends A | B>(x: T, y: T): void { }

func1(new A(), new A()); // OK
func1(new A(), new B()); // ERR
func1(new A(), new C()); // ERR

I am exploring if there is a feasible way for x and y to have matching values using "String Literal Type."

typescript generics

Answer 1

Answer №1

Aluan Haddad's insightful response provides a solution to the issue at hand:

Matching parameters according to constraints and disregarding their order is crucial for accurate inference. One suggestion is to define func2(x: T, y: U), where the second constraint is reliant on the first.

With this setup, both parameters must share the same value:

function func2<T extends 'A' | 'B', U extends T>(x: T, y: U): void { }

func2('A', 'A'); // OK
func2('A', 'B'); // ERR
func2('A', 'C'); // ERR

Answer 2

Aluan Haddad's insightful response provides a solution to the issue at hand:

Matching parameters according to constraints and disregarding their order is crucial for accurate inference. One suggestion is to define func2(x: T, y: U), where the second constraint is reliant on the first.

With this setup, both parameters must share the same value:

function func2<T extends 'A' | 'B', U extends T>(x: T, y: U): void { }

func2('A', 'A'); // OK
func2('A', 'B'); // ERR
func2('A', 'C'); // ERR

Using String Literal Types in a generic function in TypeScript

Answer №1

Similar questions

Under what circumstances would you need to manually specify the displayName of a React component?

The HTML fails to update after changes are made to the model value

Ensure that only one property is mandatory in a Typescript interface, while permitting the rest to be

Can webpack effectively operate in both the frontend and backend environments?

Leveraging the find method to sort through an array with dual parameters

Utilizing a switch case for typing

Mastering the art of Promises and handling errors

In the realm of Typescript Angular, transferring the value of an object's property to another property within the

Creating an enum in TypeScript can be accomplished by using the enum

Using an external variable within an internal function in TypeScript

Axios mandating the use of the "any" type for response type requirements

Enforcing TypeScript restrictions on method chaining during object creation

Despite being logged, the current value of firebase.auth().currentUser in Firebase is null

Improving DOM rendering speed in Internet Explorer 11 with Angular 2

Posting forms in NextJS can be optimized by utilizing onChange and keypress events for input fields

Angular with NX has encountered a project extension that has an invalid name

Tips for utilizing an observable in Angular without subscribing to it

Retrieve the tuple containing parameter types in a constructor

Step-by-step guide: Mocking a fetch request in Jest using React with TypeScript

Encountering difficulties during the migration process from a JavaScript to a TypeScript React Component