Chrome DevTools无法解析多行JS对象？报错原因及代码问题解析

核心原因：JS引擎的语句/表达式解析差异 #

当你在Chrome控制台输入单行的{ "@context": "http://schema.org/", "name": "John" }时，控制台会将这段代码当作表达式处理，此时{}会被识别为对象字面量，语法完全合法。

但输入多行格式时，引擎第一行看到单独的{，会默认将其解析为**代码块（block statement）**的起始标记。而代码块内部只能包含合法的执行语句（比如变量声明、条件判断、函数调用等），"@context": "http://schema.org/"这种键值对结构不属于合法语句，因此冒号:会被判定为无效语法，抛出Uncaught SyntaxError: Unexpected token ':'错误。

多行代码的具体问题 #

• 代码块语法不兼容键值对：代码块的作用是包裹一组执行语句，不支持对象字面量的键值对写法，冒号无法被识别。
• 引擎解析优先级：多行开头的{没有上下文提示（比如赋值、函数参数等），引擎会优先将其判定为代码块，而非对象字面量的起始。

可行的解决方式 #

如果要在控制台输入多行对象字面量，有两种常见方法：

• 用括号包裹整个结构，强制引擎按表达式解析：

  ({
    "@context": "http://schema.org/",
    "name": "John"
  })
  

• 将对象赋值给变量，此时{}会被明确识别为对象字面量：

  const person = {
    "@context": "http://schema.org/",
    "name": "John"
  }
  

内容的提问来源于stack exchange，提问作者Ali Radan