JavaScript Key Events — What's the Difference?
Not all key properties are equal. Here's what each one actually means and when to use it.
event.key — Use This
Returns the logical value of the key pressed: "a", "Enter", "ArrowLeft". It respects the user's keyboard layout and modifier keys (Shift turns "a" into "A"). This is the modern, recommended property.
event.code — Physical Location
Returns the physical key regardless of layout: "KeyA", "ShiftLeft", "Numpad0". Use this for game controls where you want WASD to stay WASD even on AZERTY keyboards. Layout-independent.
keyCode — Deprecated, but alive
Returns a numeric code like 65 for "A". Deprecated in the spec but still widely supported. Avoid in new code — use event.key instead. Some older game engines and jQuery code rely on it.
location — Left vs Right
Tells you where on the keyboard the key is: 0 = standard, 1 = left modifier, 2 = right modifier, 3 = numpad. Useful to distinguish ShiftLeft from ShiftRight when event.key returns the same "Shift" for both.