Is it possible in Typescript to reference type variables within another type variable?

Question

Is it possible in Typescript to reference type variables within another type variable?

Currently, I am working with two generic types - Client<T> and MockClient<T>. Now, I want to introduce a third generic type called Mocked<C extends Client>. This new type should be a specialized version of MockClient that corresponds to a specific specialization of Client. For example:

type PersonClient = Client<Person>;

// the following two types should be equivalent
type MockPersonClient = Mocked<PersonClient>;
type MockPersonClient = MockClient<Person>;

In essence, I aim to define a type like:

type Mocked<C extends Client<T>> = MockClient<T>;

My question is whether it is feasible to achieve this in Typescript. If not, is there any existing proposal for such functionality (I have no clue what this concept might be named), or is what I am proposing ambiguous or inherently complex to implement within a type system?

typescript generics

Answer 1

Answer №1

In my opinion, the concept you are aiming for is quite specific, but currently not supported in TypeScript (up to version 2.5). A possible solution that could help achieve this is through implementing type-level function application or utilizing the more general extended typeof operator. The inclusion of these features in TypeScript remains uncertain.

There are alternative approaches available. One method that I have utilized involves adding a redundant/phantom property of type T to your Client<T> type. If Client<T> is defined as a class, the implementation would look like:

class Client<T> {
   // phantom property
   _clientType: T = void 0 as any;

   // rest of class definition
} 
type Mocked<C extends Client<{}>> = MockClient<C['_clientType']>

While it needs to be a public property, you can designate it with an underscore to indicate internal use. At runtime, it will remain undefined and won't impact users of Client. However, if Client is an interface used to generate an instance from an object literal, there may be complications related to the absence of the _clientType property.

Ultimately, the decision to modify your class in this manner is up to you. Other individuals might offer different workarounds to consider. Best of luck!

Answer 2

In my opinion, the concept you are aiming for is quite specific, but currently not supported in TypeScript (up to version 2.5). A possible solution that could help achieve this is through implementing type-level function application or utilizing the more general extended typeof operator. The inclusion of these features in TypeScript remains uncertain.

There are alternative approaches available. One method that I have utilized involves adding a redundant/phantom property of type T to your Client<T> type. If Client<T> is defined as a class, the implementation would look like:

class Client<T> {
   // phantom property
   _clientType: T = void 0 as any;

   // rest of class definition
} 
type Mocked<C extends Client<{}>> = MockClient<C['_clientType']>

While it needs to be a public property, you can designate it with an underscore to indicate internal use. At runtime, it will remain undefined and won't impact users of Client. However, if Client is an interface used to generate an instance from an object literal, there may be complications related to the absence of the _clientType property.

Ultimately, the decision to modify your class in this manner is up to you. Other individuals might offer different workarounds to consider. Best of luck!

Is it possible in Typescript to reference type variables within another type variable?

Answer №1

Similar questions

What is the best method for storing a third-party image in cache?

Restrict the number of subscriptions allowed for an rxjs observable

Tips on effectively utilizing the generic class type parameter class

Error encountered on login page: The protocol 'http' does not exist (related to HTML, TypeScript, Angular2, and JavaScript)

Error in Directive: NgControl Provider Not Found

Make sure to call super.onDestroy() in the child component before overriding it

The issue arose as a result of a SQLITE_ERROR, specifically mentioning that the Users table does not exist. However, the model has been

Typescript threw an error stating "Cannot access properties of an undefined object" in the React-Redux-axios

The interface IJobDetails cannot be assigned to type null

Challenges encountered while deploying a NextJS project with TypeScript on Vercel

Why does the error "property undefined" keep popping up even though I've already declared it?

Error: setPosition function only accepts values of type LatLng or LatLngLiteral. The property 'lat' must be a numerical value in agm-core agm-overlay

What is the best way to ensure that GCM push notifications are still received even when the app is closed or the

Express string declaration in a single TypeScript line

Efficient methods to transfer values or arrays between components in Angular 8 without relying on local storage

Different tsconfigs assigned to various directories

TypeScript was looking for 'never' but found an intersection instead

Navigating through a list using tabs and automatic scrolling to a specific index in React with Material UI's Scrollspy

Why do I keep encountering the error "global is not defined" when using Angular with amazon-cognito-identity-js?

After pushing to history in React, the rendered component fails to display on the screen