A JavaScript keycode is a numeric value that represents a physical key on the keyboard. It's accessed via the event.keyCode property during keyboard events like keydown and keyup. Each key has a unique code — for example, the Enter key has keyCode 13, the letter "A" has keyCode 65, and the Escape key has keyCode 27. Although keyCode is now deprecated, it remains widely used for backward compatibility.

event.key returns the logical character produced by the key — what the user intended to type. For example, pressing the "A" key produces 'a' (or 'A' with Shift).

event.code returns the physical key location on the keyboard, regardless of layout. The "A" key always returns 'KeyA', even on AZERTY keyboards where it produces a different character. This makes code ideal for game controls and layout-independent key detection.

event.keyCode was deprecated because it's not layout-independent. The same physical key can produce different keyCode values depending on the keyboard layout and locale. It also doesn't account for modifier keys well. The modern event.code property provides a consistent, layout-independent identifier, while event.key gives the actual character. Together they offer a cleaner, more predictable API.

Use event.key when you need to know which character was typed (e.g., 'Enter', 'a', 'Escape').
Use event.code when you need to identify which physical key was pressed (e.g., 'KeyA', 'ArrowLeft', 'ShiftRight').

For checking modifier keys: use event.ctrlKey, event.shiftKey, event.altKey, and event.metaKey.

Modern approach (recommended):

document.addEventListener('keydown', function(event) {
    if (event.key === 'Enter') {
        // Handle Enter key
    }
    if (event.key === 'Escape') {
        // Handle Escape key
    }
    if (event.code === 'ArrowUp') {
        // Handle Arrow Up (layout-independent)
    }
});

Legacy approach:

document.addEventListener('keydown', function(event) {
    if (event.keyCode === 13) { /* Enter */ }
    if (event.keyCode === 27) { /* Escape */ }
    if (event.keyCode === 38) { /* Arrow Up */ }
});

• keydown — Fires when a key is pressed down. Repeats while the key is held.
• keyup — Fires when a key is released.
• keypress — Deprecated. Previously fired for character-producing keys. Do not use in new code.
• beforeinput — Fires before input is inserted (useful for input interception).
• input — Fires when the input value changes.

event.location identifies where on the keyboard a key is physically located:

• 0 — Standard key (most keys)
• 1 — Left side (e.g., left Shift, left Ctrl)
• 2 — Right side (e.g., right Shift, right Ctrl)
• 3 — Numeric keypad

This is especially useful for games or applications that distinguish between left and right modifier keys.

Mobile virtual keyboards often don't expose the same low-level key data as physical keyboards. In many cases, keyCode 229 indicates that the Input Method Editor (IME) is processing the key, and the actual key hasn't been resolved yet. keyCode 0 or Unidentified means the browser couldn't determine the key. This is normal on mobile devices. For reliable key detection on mobile, consider using event.key or event.code where supported, or use input events for text entry.

Use event.preventDefault() in your keydown handler. Be selective — blocking all keys breaks accessibility and browser functionality.

document.addEventListener('keydown', function(event) {
    // Prevent F5 refresh
    if (event.code === 'F5') {
        event.preventDefault();
    }
    // Prevent Ctrl+S save dialog
    if (event.ctrlKey && event.code === 'KeyS') {
        event.preventDefault();
        // Your custom save logic
    }
});

Note: Some browser shortcuts (like Ctrl+W to close tab) cannot be overridden for security reasons.