Question

170

How to type an array with classes in TypeScript?

rated 0 times [ 176] [ 6] / answers: 1 / hits: 31195 / 8 Years ago, mon, june 6, 2016, 12:00:00

I have an app that initializes by running its method .init(params) like this:

app.init([TopBar, StatusBar, MainArea]);

Where TopBar, StatusBar and MainArea are classes, not instances of classes. Each of these classes implements the same interface IComponent.

I want to instantiate objects from the passed classes in the .init(params) method, like this:

init(params: IComponent[]): void {

    params.map(function (component) {

        let comp = new component();

        this.components[comp.constructor.name] = comp;

    }, this);

The issue is that as these are not instance, TypeScript doesn't know their types and throws an error:

error TS2345: Argument of type '(typeof TopBar | typeof StatusBar |
typeof MainArea)[]' is not assignable to parameter of type
'IComponent[]'.

How do I fix the code so that I could pass an array of classes that implement some interface to a method?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jazminuniquer

Add To Favorites

Follow

Total Points: 63

Total Questions: 121

Total Answers: 96

Location: Cambodia

Member since Thu, May 21, 2020

4 Years ago

jazminuniquer questions

1 Next.js change locale for the current path that has query, using router

Sat, Nov 20, 21, 00:00, 3 Years ago

1 Error: bundle initial-es5 exceeded maximum budget. Budget 6.00 MB was not met by 133.51 kB with a total of 6.13 MB

Thu, Feb 18, 21, 00:00, 3 Years ago

1 How to get values from client.users.fetch(id) in discord.js

Thu, Sep 3, 20, 00:00, 4 Years ago

1 Apply motion to react component Framer-Motion

Thu, Jun 25, 20, 00:00, 4 Years ago

1 Vuetify - How to select a row data using v-radio-group in v-data-table

Tue, May 19, 20, 00:00, 4 Years ago

View All

answered 8 Years ago siena · Accepted Answer

There is a working typescript playground (run it to get alert with result)

what we need is to create a custom type InterfaceComponent. That will be expected as an array of the init() method

interface IComponent { }

class TopBar    implements IComponent { }

class StatusBar implements IComponent { }

class MainArea  implements IComponent { }



// this is a type we want to be passed into INIT as an array

type InterfaceComponent = (typeof TopBar | typeof StatusBar | typeof MainArea);



class MyClass {



  components: {[key:string] : IComponent } = {};



  init(params: (InterfaceComponent)[]): void {

    params.map((component) => {

        let comp = new component();

        this.components[comp.constructor[name]] = comp;

    }, this);

  }

}



let x = new MyClass();

x.init([TopBar, StatusBar, MainArea])



alert(JSON.stringify(x.components))

Check it here