An interface that is extended by an optional generic parameter

Question

An interface that is extended by an optional generic parameter

I currently have an exported abstract class that has one generic. However, I now require two generics. I do not want to modify all existing classes that are using this class. Therefore, I am looking to add an optional generic class that extends an interface.

Here is my current implementation:

export abstract class SharedShell<T extends IBase, T1 extends IBase> implements OnInit, OnDestroy {}

What would be the best approach to make T1 optional? I attempted the following:

export abstract class SharedShell<T extends IBase, T1 extends IBase | Undefined = Undefined> implements OnInit, OnDestroy {}

However, I encountered a type error:

'IBase' can be assigned to the constraint of type 'T1', but 'T1' could potentially be instantiated with a different subtype of constraint 'IBase'.

This is where I am facing a roadblock. How should I proceed to address this issue?

View TS Playground example

angular typescript generics

Answer 1

Answer №1

In order to utilize your SharedShell as stated, I would implement a conditional type utilizing the Extract utility type to transform T1 into a suitable form:

export abstract class SharedShell<T extends IBase, T1 extends IBase | undefined = undefined> {
    constructor(private detailService: ISharedService<T | Extract<T1, IBase>>,
        private listService: ISharedService<T>,
    ) { }
}

If T1 is undefined, then Extract<T1, IBase> will result in never, making T | never equal to T... which aligns with your requirements. If T1 represents a union (e.g., SomeSubtypeOfIBase | undefined), then Extract<T1, IBase> will only include the part that can be assigned to IBase (e.g., SomeSubtypeOfIBase).

I am unsure of the purpose served by the second parameter T1, so the subsequent suggestion may not be feasible, but: you could consider setting T1 to default to never and excluding undefined from the domain of T1. With this approach, the type T | T1 will always be assignable to

IBase</code, leading to seamless operation:</p>
<pre><code>export abstract class SharedShell<T extends IBase, T1 extends IBase = never> {
    constructor(private detailService: ISharedService<T | T1>,
        private listService: ISharedService<T>,
    ) { }
}

Once again, without further context on how T1 is utilized, I cannot guarantee the effectiveness of this solution. However, it offers a more simplistic approach.

Playground link to code

Answer 2

In order to utilize your SharedShell as stated, I would implement a conditional type utilizing the Extract utility type to transform T1 into a suitable form:

export abstract class SharedShell<T extends IBase, T1 extends IBase | undefined = undefined> {
    constructor(private detailService: ISharedService<T | Extract<T1, IBase>>,
        private listService: ISharedService<T>,
    ) { }
}

If T1 is undefined, then Extract<T1, IBase> will result in never, making T | never equal to T... which aligns with your requirements. If T1 represents a union (e.g., SomeSubtypeOfIBase | undefined), then Extract<T1, IBase> will only include the part that can be assigned to IBase (e.g., SomeSubtypeOfIBase).

I am unsure of the purpose served by the second parameter T1, so the subsequent suggestion may not be feasible, but: you could consider setting T1 to default to never and excluding undefined from the domain of T1. With this approach, the type T | T1 will always be assignable to

IBase</code, leading to seamless operation:</p>
<pre><code>export abstract class SharedShell<T extends IBase, T1 extends IBase = never> {
    constructor(private detailService: ISharedService<T | T1>,
        private listService: ISharedService<T>,
    ) { }
}

Once again, without further context on how T1 is utilized, I cannot guarantee the effectiveness of this solution. However, it offers a more simplistic approach.

Playground link to code

An interface that is extended by an optional generic parameter

Answer №1

Similar questions

Explaining the structure of a nested object within a TypeScript declaration file

The VSCode Extension fails to launch after being packaged

Utilizing UseRef in Typescript for an Idle Timer

What is the best way to position Scroll near a mat row in Angular?

Exploring the implementation of initiating paypal in NestJs using Jest testing framework

Refresh the Angular view only when there are changes to the object's properties

Allow users to create an unlimited number of components by simply clicking on Ionic with a customizable click event

Angular's Dynamic Reactive Forms

Unable to replicate the function

Tips for showing a DialogBox when a blur event occurs and avoiding the re-firing of onBlur when using the DialogBox

Suggestions for Deleting Previous Polylines When Adding a New Path

Angular2 tubes sieve through hyperlinks within HTML content

React component state remains static despite user input

The formBuilder validator pattern seems to be malfunctioning

Is there a way to seamlessly transfer (optional) parameters from a CloudFormation template to a CDK resource within a CfnInclude without statically defining the list of parameters?

What could be causing this error in a new Next.js application?

Using Angular and Typescript to implement mathematical formulas involving date object subtraction

Troubleshooting tip: The request body is missing and needs to be added to resolve the issue

When working with Angular, the onSubmit method may sometimes encounter an error stating "get(...).value.split is not a function" specifically when dealing with Form

Enhancing Request JSON Body Validation in Next.js 14 API Handler