在过去的几个版本的 Chrome 中，KeyboardEvent 新增了两个参数，这些参数会作为参数传递给 keydown、keypress 和 keyup 事件监听器。code 属性（在 Chrome 48 中添加）和 key 属性（在 Chrome 51 中添加）可让开发者轻松获取信息，否则使用旧属性会很难获取。
代码属性
首先是 code 属性。此值设为一个字符串，表示用于生成 KeyboardEvent 的按键，不考虑当前键盘布局（例如，QWERTY 与 Dvorak）、语言区域（例如英语与法语）或任何修饰键。如果您关心的是按下的实体按键，而不是它对应的字符，此方法非常有用。例如，如果您正在编写游戏，可能希望使用一组特定按键来让玩家向不同方向移动，而这种映射最好与键盘布局无关。
键属性
接下来，我们有新的 key 属性。它也设置为字符串，但 code 会返回有关按下的物理按键的信息，而 key 会包含该按键生成的字符，同时考虑当前的键盘布局、语言区域和修饰键。当您需要知道屏幕上会显示哪个字符（就像用户输入文本输入内容一样）时，查看 key 属性的值会很有用。
这在实践中意味着什么？
举个具体例子，假设您的用户使用的是采用 QWERTY 键盘布局的美国键盘。按该键盘上的实体 Q 按键将会产生一个 KeyboardEvent，其 code 属性设置为 "KeyQ"。无论键盘布局如何，无论是否使用任何其他修饰键，都是如此。相比之下，在法式 (AZERTY) 键盘上，即使键帽上印的是字母“a”，此按键的 code 仍为 "KeyQ"。在同一美国键盘上按物理 Q 键通常会生成一个 KeyboardEvent，其中 key 设置为 "q"（不使用修饰键）、"Q"（使用 Shift 或 CapsLock 键）或 "œ"（在 OS X 上，使用 Alt 键）。在法式 AZERTY 键盘上，这个按键会生成“a”（如果使用 SHIFT 或 CapsLock 键，则会生成“A”）。对于其他键盘布局，key 值可以是 "й"、"ض"、"ㅂ"、"た" 或其他字符。我们再来看一下前面的游戏示例。如果您希望游戏使用 WASD 键进行移动，可以使用 code 属性并检查 "KeyW"、"KeyA"、"KeyS" 和 "KeyD"。这适用于所有键盘和所有布局，即使是将“w”和“z”键的位置互换的 AZERTY 键盘也是如此。
虚拟键盘
您会发现，到目前为止，我们一直在假定使用实体键盘的行为。那么，对于在虚拟键盘或其他输入设备上输入的用户，该怎么办？规范提供了有关 code 属性的官方指南。总而言之，模仿标准键盘布局的虚拟键盘应该会导致设置适当的 code 属性，但采用非传统布局的虚拟键盘可能会导致根本不设置 code。
key 属性的处理方式更为简单，您应该根据用户（虚拟）输入的字符将其设置为字符串。
试试看
Gary Kačmarčík 制作了一个精彩的演示，用于直观呈现与 KeyboardEvent 相关的所有属性：
跨浏览器支持
截至本文撰写之时，仅 Chrome 48 及更高版本、Opera 35 及更高版本和 Firefox 44 及更高版本支持 code 属性。Firefox 44 及更高版本、Chrome 51 及更高版本和 Opera 38 及更高版本支持 key 属性，Internet Explorer 9 及更高版本和 Edge 13 及更高版本部分支持此属性。