4Hau in die Tasten

Unsere Schlange soll den Tastatureingaben des Benutzers folgen. Dazu benötigst du ein paar Informationen.

Zunächst ist eine Tastatureingabe ein Event (Ereignis). Das kennst du schon von den Event-Attributen in HTML z.B. bei Klicks. Das Ereignis wird vom Browser erkannt, aber dein Code muss auch darauf reagieren. Dazu gibt es die sogenannten Eventlistener. Wenn du weißt, wie ein Event heißt, dann kannst du über dein DOM angeben, welche Funktion bei einem solchen Event aufgerufen werden soll. Diese Technik bzw. Funktion nennt sich eine Callback-Funktion und in diesem Fall spricht man von einem Eventhandler, weil die Funktion auf ein Event reagiert.

Jedem Eventhandler wird als Übergabeparameter das Event selbst als Objekt übergeben. Die Attribute des Objekts geben z.B. an, auf welches target (Ziel) geklickt wurde, an welche Position auf der Seite (x-/y-Koordinaten) oder welche Taste gedrückt wurde.

Die Taste im Attribut keycode gespeichert. Welche Taste es auf der Tastatur war zeigt der keycode in Form einer Zahl an. Die Leertaste entspricht z.B. dem keycode 32.