TypeScript abstract class generics: `Class<?>` type

Question

TypeScript abstract class generics: `Class<?>` type

When working with TypeScript, I often utilize a Java-like type called Class:

interface Class<T = void> {

    new(...args: any[]): T;

}

Unfortunately, this type doesn't seem to be compatible with abstract classes:

abstract class Bar {}

class Foo {
   
  test(clazz: Class) { }

  doIt() {
    this.test(Bar);//ERROR
  }
}

Upon attempting this, I receive an error stating that "Argument of type 'typeof Bar' is not assignable to parameter of type 'Class<void>'". This issue arises because the new operator cannot be used with abstract classes. Hence, I'm seeking a type that can cater to both abstract and non-abstract classes. Is there a way to achieve this?

typescript

Answer 1

Answer №1

To achieve this, you can utilize an abstract construct signature:

type Class<T = void> =
  abstract new (...args: any[]) => T;

This signature allows you to assign both a regular/concrete constructor and an abstract constructor as needed:

abstract class Bar { }
class Baz { }

class Foo {

  test(clazz: Class) { }

  doIt() {
    this.test(Bar); // acceptable
    this.test(Baz); // acceptable
  }
}

It's important to note that abstract construct signatures must be in the form of an arrow construct expression (similar to a function expression); you cannot use abstract before new in an object-like construct signature:

interface Oops<T = void> {
  abstract new(...args: any[]): T; // error!
  //~~~~~~ <-- 'abstract' modifier cannot appear on a type member
}

For further exploration and testing, you can visit the TypeScript Playground with the provided Playground link.

Answer 2

To achieve this, you can utilize an abstract construct signature:

type Class<T = void> =
  abstract new (...args: any[]) => T;

This signature allows you to assign both a regular/concrete constructor and an abstract constructor as needed:

abstract class Bar { }
class Baz { }

class Foo {

  test(clazz: Class) { }

  doIt() {
    this.test(Bar); // acceptable
    this.test(Baz); // acceptable
  }
}

It's important to note that abstract construct signatures must be in the form of an arrow construct expression (similar to a function expression); you cannot use abstract before new in an object-like construct signature:

interface Oops<T = void> {
  abstract new(...args: any[]): T; // error!
  //~~~~~~ <-- 'abstract' modifier cannot appear on a type member
}

For further exploration and testing, you can visit the TypeScript Playground with the provided Playground link.

TypeScript abstract class generics: `Class<?>` type

Answer №1

Similar questions

NativeScript encountered an error while trying to locate the module 'ui/sidedrawer' for the specified element 'Sidedrawer'

What are the steps to implementing MSAL in a React application?

Is it possible for Typescript to resolve a json file?

Utilizing TypeScript namespaced classes as external modules in Node.js: A step-by-step guide

What is causing my function to execute twice in all of my components?

Unleashing the power of await with fetch in post/get requests

Can you explain the significance of the @ symbol in TypeScript/Vue?

verify this condition prior to executing the for loop in javascript

How to Decode JSON Data in Angular 2/4 with the Help of HttpClientModule

Tips for prohibiting the use of "any" in TypeScript declarations and interfaces

Bringing in TypeScript declarations for the compiled JavaScript librarybundle

Tips for importing several makeStyles in tss-react

retrieve information from Angular service

Implementing setDoc with Firebase-Admin using Typescript in Firestore

Is it possible to reference the prior value of a computed Angular signal in any way?

Is there a way to access the value of the --base-href parameter in my Angular project during the build process?

When receiving JSON and attempting to store the data in a variable, I encounter an issue where it returns the error message "undefined is not iterable (cannot read property Symbol

Dealing with DomSanitizer problem in Angular 2

Leveraging Angular 4-5's HttpClient for precise typing in HTTP requests

Adding URL path in Angular 7's .ts file