Uncaught SyntaxError报错 JS新手开发2D Runner游戏语法问题求助

报错产生原因 #

Uncaught SyntaxError: Unexpected end of input 本质是JavaScript解析器执行到文件末尾时，仍有未闭合的语法块，你的代码里存在两处未闭合的花括号：

• keydown 事件绑定的箭头函数回调没有补全闭合花括号}，仅闭合了内部的if代码块
• 最外层DOMContentLoaded事件绑定的箭头函数回调也没有补全闭合花括号}，整个初始化块处于开放状态

额外注意：你的代码中const grid = document.querySelector ('grid'); 存在逻辑隐患，querySelector参数如果是类名需要加前缀.、ID需要加前缀#，当前写法只会匹配原生<grid>标签，大概率不符合你的实际需求，可后续自行调整。

修复方法 #

按顺序补全两个缺失的花括号即可：

1. 在keydown事件的if块结束后、touchstart事件绑定前，补充}闭合keydown的回调函数
2. 在所有代码末尾补充}闭合最外层DOMContentLoaded的回调函数

修复后的完整代码如下：

document.addEventListener('DOMContentLoaded', () => {

  // GLOBAL ELEMENTS //
  const player = document.querySelector ('.player');
  const body = document.querySelector ('.body');
  const grid = document.querySelector ('.grid'); // 这里假设你要选类名为grid的元素，可自行调整
  const menu = document.getElementById ('menu');
  const heading=document.getElementById ('heading');

  // INPUT SETTING //
  document.addEventListener ('keydown', (e)=> {
    if (e.code === "Space") {
       console.log ("Space bar pressed");
    }
  }); // 补全keydown回调的闭合花括号

  document.addEventListener ('touchstart', (e)=> {
    console.log("TOUCHED");
  }); 
}); // 补全DOMContentLoaded回调的闭合花括号

内容的提问来源于stack exchange，提问作者ENER-G