Typescript generics for array

Question

I need to extend a generic list of Array which has been extended from my class. How to do it properly?

export interface DeliveryMethod {
  readonly id: string;
  readonly company: string;
  readonly cost: number;
  readonly threshold: number;
  readonly intervals: Array<Interval>;
  readonly paymentMethods: Array<PaymentMethod>;
}

export interface Delivery {
  selected: SelectedDelivery;
  available: { [key : string] : Array<T extends DeliveryMethod>};
}

Cannot find name 'T'.ts(2304)

available: { [key : string] : Array<T extends DeliveryMethod>};

For example i need something like that:

const Delivery = {
   selected :{/*data inside*/},
   available:{
      pickup: [<Pickup>{},<Pickup>{}],
      courier: [<Courier>{},<Courier>{}]  
   }
}

export interface Delivery<T> - you need to declare your generic parameter. — VLAZ
– VLAZ, Commented Apr 14, 2020 at 5:15
Because I just wrote it too short, I suppose. I was trying to save space, I guess. export interface Delivery<T extends DeliveryMethod> - you should declare the generic parameter with its constraints as part of the interface declaration (or method/function declaration for a generic version of that when you have it). Once you've declared the parameter, you can then just use it within your interface as just the generic parameter name: available: { [key : string] : Array<T>};. — VLAZ
– VLAZ, Commented Apr 14, 2020 at 5:31
Could you not just have Array<DeliveryMethod>? I'm guessing anything that extends it would also work? — OliverRadini
– OliverRadini, Commented Apr 14, 2020 at 7:10
Do you really need a different type for Pickup and Courier? — Christian Vincenzo Traina
– Christian Vincenzo Traina, Commented Apr 14, 2020 at 7:20

Christian Vincenzo Traina · Accepted Answer · 2020-04-14 07:45:49Z

The @aopanasenko answer is fine. I want to complete it adding a way to solve the problem of multiple specifications.

If the properties of available aren't much, and they're fixed and stable, then you could think about listing them all in the Delivery interface:

interface Delivery<T extends DeliveryMethod, U extends DeliveryMethod> {
  available: { [key : string] : Array<T | U>};
};

Then you can define the delivery object like this:

const delivery: Delivery<Pickup, Courier>

If you don't know the properties a priori, then you need a way to link a property name to a TypeScript type, for example I added an available object just for the mapping:

interface Delivery {
  available: { [key: string]: Array<DeliveryMethod> | null };
};

const delivery: Delivery = {
  available: {}
}

const available: {
  pickup: Pickup[] | null,
  courier: Courier[] | null
} = {
  pickup: null,
  courier: null
};

delivery.available = { ...delivery.available, ...available };

In this way, it's correctly type-checked. I also added | null in order to provide an example, you can remove it.

aopanasenko · Accepted Answer · 2020-04-14 07:07:21Z

0

Update

As mentioned by @AndreaSimoneCosta in comment the following code should work:

export interface DeliveryMethod {
  readonly id: string;
  readonly company: string;
  readonly cost: number;
  readonly threshold: number;
  readonly intervals: Array<Interval>;
  readonly paymentMethods: Array<PaymentMethod>;
};

export interface Delivery<T extends DeliveryMethod = DeliveryMethod> {
  selected: SelectedDelivery;
  available: { 
    [key : string] : Array<T>
  };
};

You should define generic type parameter list in angle brackets following the name of the Delivery interface:

export interface DeliveryMethod {
  readonly id: string;
  readonly company: string;
  readonly cost: number;
  readonly threshold: number;
  readonly intervals: Array<Interval>;
  readonly paymentMethods: Array<PaymentMethod>;
};

export interface Delivery<T extends DeliveryMethod> {
  selected: SelectedDelivery;
  available: { 
    [key : string] : Array<T>
  };
};

edited Apr 14, 2020 at 7:07

answered Apr 14, 2020 at 5:36

aopanasenko

4784 silver badges14 bronze badges

9 Comments

Andrea Simone Costa Over a year ago

But then he isn't able to have different types inside different arrays, as happens in his last example

aopanasenko Over a year ago

@AndreaSimoneCosta, think types Courier and Pickup have the same structure with DeliveryMethod .

Andrea Simone Costa Over a year ago

And if you do like these, you could mix the types :( typescriptlang.org/play/#code/…

aopanasenko Over a year ago

@AndreaSimoneCosta, thanks for pointing out inaccuracies in my answer. I updated an answer with link to your comment.

Andrea Simone Costa Over a year ago

@Иван Яковлев T extends DeliveryMethod = DeliveryMethod means that T should be assignable to DeliveryMethod and, if you don't provide a T, `DeliveryMethod' will be used as default type value.

|

Collectives™ on Stack Overflow

Typescript generics for array

2 Answers 2

Comments

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related