We can create a generic type alias similar to create a regular type alias:
type MyEvent<T> = {
target: T,
type: string
};
When we use the generic type alias, we have to explicitly bind its type parameters , TS won’t infer them for us:
type ButtonEvent = MyEvent<HTMLButtonElement>;
let myEvent: MyEvent<HTMLButtonElement | null> = {
target: document.querySelector('#myButton'),
type: 'click'
}
We can use the generic type alias to build another type:
type TimedEvent<T> = {
target: MyEvent<T>,
from: Date,
to: Date
}
We can use the generic type alias in a function’s signature, when TS binds(infers) a type to T, it’ll also bind it to the generic type:
function triggerEvent<T>(event: MyEvent<T>): void {
// ...
}
triggerEvent({
target: document.querySelector('#myButton'),
type: 'mouseover'
});