Creating an extended class with mandatory properties

Question

Creating an extended class with mandatory properties

In order to streamline code sharing between two classes that overlap, I decided to create a new class called Common.

For one of the subclasses, I needed all the properties from the Common class to be required. My initial thought was to utilize the Required utility type in the following manner:

class A extends Common {
  //...
 }

class B extends Required<Common> {
  //...
 }

Unfortunately, I encountered an error stating that Required is not defined. Is there a straightforward solution to achieve my desired outcome, or should I consider revising the code entirely?

typescript class

Answer 1

Answer №1

To ensure that properties are required, you can utilize extends Common and implement them using implements:

class Common {
  foo?: string;
  bar?: number;
}

class A extends Common {
  //...
 }

class B extends Common implements Required<Common> {
  constructor(
    public foo: string,
    public bar: number,
  ) {
    super();
  }
 }

Interactive Example

Answer 2

To ensure that properties are required, you can utilize extends Common and implement them using implements:

class Common {
  foo?: string;
  bar?: number;
}

class A extends Common {
  //...
 }

class B extends Common implements Required<Common> {
  constructor(
    public foo: string,
    public bar: number,
  ) {
    super();
  }
 }

Interactive Example

Creating an extended class with mandatory properties

Answer №1

Similar questions

Converting an array of objects into a dictionary using TypeScript

Ways to efficiently update the API_BASE_URL in a TypeScript Angular client generated by NSwag

Encountering an error in Cytoscape using Angular and Typescript: TS2305 - Module lacks default export

Error: Module not found - Issue with importing SVG files in NextJS

Why is passing data:{} to a route essential for achieving the desired outcome?

The automatic inference of function argument types and the implementation of conditional types

Creating an interface that accurately infers the correct type based on the context

Encountering build errors in .xproj file when working with Type Script in ASP.Net Core

Using TypeORM: Implementing a @JoinTable with three columns

Encountering an error in Angular 2: "date.getMonth is not a function

Connect a click event from one component to another component

The error message "Property 'data1' is not a valid property on the object type {}"

Angular progress tracker with stages

Finding the specific type within a union based on its field type

Can you please explain the significance of classes <T> and <U> in Angular 2?

Using Dropbox for seamless navigation

Angular 12: Ensure completion of all data fetching operations (using forkJoin) prior to proceeding

Installation and execution of TypeScript jQuery / Bootstrap definition file on a local machine using npm typings: A step-by-step guide

Implement the CSS styles from the Parent Component into the Child Component using Angular 6

The modal popup will be triggered by various button clicks, each displaying slightly different data within the popup