角色移动需持续追踪按键状态而非仅监听keydown，用keys对象记录方向键、虚拟摇杆处理触控、activeInput标识防冲突，移动逻辑统一走applyVelocity(dt)函数实现帧率自适应与物理同步。
怎么让角色响应键盘方向键移动（HTML5 Canvas + JavaScript）
关键不是监听 keydown 就完事，而是得持续追踪按键状态。浏览器默认只在按下瞬间触发一次 keydown，松开才触发 keyup，但角色移动需要“按住就持续走”。
- 用一个对象记录方向键状态：
keys = { ArrowUp: false, ArrowDown: false, ArrowLeft: false, ArrowRight: false } - 在
keydown和keyup事件里实时更新这个对象 - 游戏主循环（
requestAnimationFrame）中根据keys值计算位移，而不是在事件里直接改位置
常见错误：在 keydown 里直接执行 player.x += 5 —— 这会导致按一下只动一帧，角色“卡顿跳进”，不是平滑移动。
触屏上如何模拟方向控制（避免误触和延迟）
移动端没有方向键，硬套键盘逻辑会出问题：手指一碰屏幕就触发所有 touchstart，而且 touchmove 容易被系统滚动劫持。
- 别用全屏
touchstart监听，而是画一个固定区域的虚拟摇杆（比如左下角 120×120px 的div） - 监听该区域内的
touchstart和touchmove，用touches[0].clientX/Y算偏移角度和长度 - 设定最小触发阈值（比如偏移 > 15px 才算有效输入），避免轻点误判为移动
性能注意：别在 touchmove 里做重绘或复杂计算，只更新方向向量，渲染交给主循环。
立即学习“前端免费学习笔记（深入）”；
键盘+触控共存时，怎么防止操作冲突
用户可能一边插着键盘一边用手机访问，或者在平板上外接蓝牙键盘——这时两套输入同时生效，角色会“抽风式加速”。
- 维护一个输入源标识：
activeInput = 'keyboard' | 'touch' | null - 第一次收到键盘事件时设为
'keyboard'，第一次收到有效触控事件时设为'touch' - 后续只响应当前
activeInput对应的输入，另一套被静默忽略 - 如果超过 1.5 秒没收到任何输入，重置为
null，允许下次任一输入激活
容易踩的坑：不重置状态，导致用户切设备后操作完全失灵；或者重置太频繁，造成触摸中断。
移动逻辑写在哪？为什么不能直接改 player.x 和 player.y
直接赋值会绕过物理系统，导致碰撞检测失效、动画不同步、网络同步错乱。
- 移动应统一走一个
applyVelocity(dt)函数，接收时间差dt（毫秒），按帧率自适应速度 - 例如：如果目标速度是每秒 200px，则每帧位移 =
200 * dt / 1000 - 所有输入（键盘、触控、AI、网络指令）最终都转成「目标速度向量」，再由该函数统一分配到
player.x和player.y
兼容性影响：不基于 dt 的硬编码位移，在低端设备上会变慢，在高刷屏上会过快；且无法和 Phaser、PixiJS 等引擎的 ticker 对齐。
有些边界情况藏得深：比如快速切换方向时，若没做加速度缓冲，角色会瞬间掉头，失去惯性感；而加速度又不能写死，得看游戏类型——格斗游戏要快响应，RPG 可以带拖拽感。
