Hoi allemaal,
Het leek me leuk om eens aan de slag te gaan met generics in TypeScript. Ik probeer een data store te maken in Redux-stijl. Deze moet minstens drie operaties ondersteunen: SET, UPDATE and DELETE. De parameters zijn voor elke operatie verschillend.
Daarnaast wil ik het makkelijk maken om mijn store uit te breiden door het operatietype ook te generalizeren.
Ik heb twee voorbeelden gemaakt. In het eerste voorbeeld is het operatietype nog niet generiek. Daar worden de types ook afgeleid zoals ik het verwacht, zodat jullie kunnen zien waar ik naar toe wil.
In mijn tweede voorbeeld is het operatietype generiek. Echter herkent TypeScript niet alle attributen van mijn operaties, maar enkel de attributen die ALLE operaties gemeen hebben (type en description).
Ik declareer de generieke types als volgt:
En mijn reducer ziet er als volgt uit:
Leidt operatietype goed af:
Leidt operatietype niet goed af:
Blijkbaar declareer ik mijn generieke types niet op de juiste manier. Hebben jullie wellicht een suggestie hoe het wel moet?
Alvast bedankt!
Voorbeelden:
Werkt: https://stackblitz.com/ed...t?file=example%2Fworks.ts
Werkt niet: https://stackblitz.com/ed...=example%2Fdoesnt_work.ts
Het leek me leuk om eens aan de slag te gaan met generics in TypeScript. Ik probeer een data store te maken in Redux-stijl. Deze moet minstens drie operaties ondersteunen: SET, UPDATE and DELETE. De parameters zijn voor elke operatie verschillend.
Daarnaast wil ik het makkelijk maken om mijn store uit te breiden door het operatietype ook te generalizeren.
Ik heb twee voorbeelden gemaakt. In het eerste voorbeeld is het operatietype nog niet generiek. Daar worden de types ook afgeleid zoals ik het verwacht, zodat jullie kunnen zien waar ik naar toe wil.
In mijn tweede voorbeeld is het operatietype generiek. Echter herkent TypeScript niet alle attributen van mijn operaties, maar enkel de attributen die ALLE operaties gemeen hebben (type en description).
Ik declareer de generieke types als volgt:
JavaScript:
1
| class Store<CONTEXT extends StoreContext, ACTION extends Action<CONTEXT> = Action<CONTEXT>> |
En mijn reducer ziet er als volgt uit:
Leidt operatietype goed af:
JavaScript:
1
| reduce(state: CONTEXT, action: Action<CONTEXT>): CONTEXT { } |
Leidt operatietype niet goed af:
JavaScript:
1
| reduce(state: CONTEXT, action: ACTION): CONTEXT { } |
Blijkbaar declareer ik mijn generieke types niet op de juiste manier. Hebben jullie wellicht een suggestie hoe het wel moet?
Alvast bedankt!
Voorbeelden:
Werkt: https://stackblitz.com/ed...t?file=example%2Fworks.ts
Werkt niet: https://stackblitz.com/ed...=example%2Fdoesnt_work.ts