VSCode中含@符号的JSON键解析报错，如何正确获取对应值？

嘿，你遇到的问题其实是JavaScript标识符规则和JSON键命名规则的差异导致的！

问题根源 #

JSON的键可以是任意字符串（只要用双引号包裹），所以带@开头的键是完全合法的。但JavaScript里，用点语法访问对象属性时，属性名必须是合法标识符——而@不属于标识符的合法起始字符，所以直接写@context或者@graph[0].@type会被解析器判定为语法错误。

正确的解决方案：使用方括号语法访问 #

要访问带特殊字符的对象属性，必须用方括号+字符串的方式，具体修正后的可运行代码如下：

<script>
// 先把JSON-LD数据赋值给一个变量，方便后续操作
const jsonLD = { 
  "@context": "https://example.org", 
  "@graph": [ 
    { 
      "@type": "Organization", 
      "@id": "https://examples.com/#organization", 
      "name": "", 
      "url": "https://examples.com/", 
      "sameAs": [] 
    } 
  ] 
};

// 用方括号语法访问带@的属性
var x = jsonLD["@context"]; 
var y = jsonLD["@graph"][0]["@type"]; 

console.log(x); // 输出：https://example.org
console.log(y); // 输出：Organization
</script>

关键注意点 #

• 必须先将JSON数据赋值给一个变量（比如jsonLD），否则无法在JavaScript中直接操作这些属性
• 所有带@的属性，都要用对象["属性名"]的格式访问，不能用点语法
• 嵌套属性的访问同理，比如jsonLD["@graph"][0]["@type"]，先拿到@graph数组，再取第一个元素，最后访问它的@type属性

这样修改后，代码就能正常运行，控制台也能正确输出你想要的值啦！

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