Property discovered as a class method in Typescript

Question

Property discovered as a class method in Typescript

I'm experiencing a minor issue with my TypeScript code. Here's the situation:

class Component {
    assertBoolean(): boolean {
       return true;
    }
}

class DummyComponent extends Component() {
}

const components: Component[] = [DummyComponent];

Upon running this code, I encountered the following TypeScript error message:

error TS2322: Type 'typeof DummyComopnent' is not assignable to type 'Component'. Property 'assertBoolean' is missing in type 'typeof DummyComponent'.

I'm a bit confused as to what went wrong here, it seems like a basic object-oriented programming concept.

typescript

Answer 1

Answer №1

If you want to create an instance of a class in TypeScript, you need to use the new operator. Simply using the class name like DummyComponent only represents the class itself, not an instance of it. Here's an example:

class Component {
    assertBoolean(): boolean {
        return true;
    }
}

class DummyComponent extends Component {
}

const components: Component[] = [ new DummyComponent() ];

To store classes in an array and instantiate them later on, you can specify the type of the class using typeof Component. This ensures that you are dealing with the class type and not an instance of the class. Here's how you can do it:

const components: (typeof Component)[] = [DummyComponent];
new components[0]();

Answer 2

If you want to create an instance of a class in TypeScript, you need to use the new operator. Simply using the class name like DummyComponent only represents the class itself, not an instance of it. Here's an example:

class Component {
    assertBoolean(): boolean {
        return true;
    }
}

class DummyComponent extends Component {
}

const components: Component[] = [ new DummyComponent() ];

To store classes in an array and instantiate them later on, you can specify the type of the class using typeof Component. This ensures that you are dealing with the class type and not an instance of the class. Here's how you can do it:

const components: (typeof Component)[] = [DummyComponent];
new components[0]();

Property discovered as a class method in Typescript

Answer №1

Similar questions

(NextAuth) Error: The property 'session' is not found within the existing type '{}'

Implementing the react-i18next withNamespaces feature in Ant Design forms

When utilizing a property on "this" within a function defined in a constructor, the compiled JavaScript code produces an undefined result

Iterating over a map object using ngFor

Combining generic types in an array into a single union

What is the TypeScript equivalent of the Java interface.class?

How can I reduce unnecessary spacing in a primeNg Dropdown (p-dropdown) filter within an Angular 5 application?

Restricting types does not appear to be effective when it comes to properties that are related

Encountering difficulties while attempting to transition from angular 9 to angular 10

How to use Angular 2 to communicate with JavaScript API whenever the router switches to

Determine the category of a container based on the enclosed function

Angular 8 Refresh Token Implementation

Unable to globally override the default font in MUI theme

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

The absence of the 'profileStore' property is noticed in the '{}' type, which is necessary in the 'Readonly<AppProps>' type according to TypeScript error code ts(2741)

Using p5.js with TypeScript and Webpack is not supported

Encountering an unexpected token error while trying to compile a Typescript file to Javascript, even though it had previously worked

A comprehensive guide to using Reactive Forms in Angular

Ways to access the new value of a cell in a Material UI Datagrid through the use of GridCellParams

Tips for sending data from a child component to a parent component