typescript - Hur kan en händelse som tas emot i en callback för addEventListener vara null?

input!.addEventListener('keyup', (event) => {
  console.log(event.target.value);
});

TS-kompilatorn hävdar att event kan vara null. Hur kan detta vara? Per definition är detta en callback-funktion som kommer att anropas när det finns ett keyup-event.

Jag förstår att detta enkelt kan lösas med: (event.target as HTMLSelectElement).value. Jag frågar inte efter en lösning för detta. Jag är nyfiken på vad TS är.

Varför/hur kan event vara null inom en callback-funktion för den händelsen?

Svar #1

Typen EventTarget är intever från HTMLElement som standard eftersom HTML-element inte är de enda sakerna som kan vara händelseobjekt.

Baserat på detta

Element, Document och Window är de vanligaste händelseobjekten, men andra objekt kan också vara händelseobjekt. Till exempel XMLHttpRequest, AudioNode, AudioContext och andra.

Så om ditt input är HTMLElement får inte EventTarget vara null och du har redan en lösning ((event.target as HTMLSelectElement).value).

Men som jag sa är EventTarget ett mer abstrakt gränssnitt än Element och i TypeScript är det av typen EventTarget | null.

Event.target: EventTarget | null