JS定义含对象数组的对象时报missing ]语法错误原因求解

报错原因分析 #

你这段代码报错的核心是混淆了对象字面量和数组的语法规则，触发了JavaScript的计算属性名语法解析逻辑：

• 当你在外层写{}的时候，JS会把这部分解析为对象字面量，对象字面量要求内部是键: 值的结构
• 你写的{[这个连续符号，会被JS识别为计算属性名的语法：计算属性名的规则是[表达式]: 值，也就是说JS会认为你接下来要写的是属性名的表达式，表达式结束后需要跟]然后加冒号和属性值
• 但你写的[后面放了两个对象组成的数组结构，全程没有出现闭合]之后的冒号和值，所以JS解析到最后找不到匹配的]以及后续的属性值定义，就抛出了SyntaxError: missing ] in computed property name的错误

移除外层花括号正常运行的原因 #

当你去掉外层的{}后，代码变成标准的数组定义语法，完全符合JS语法规则，所以可以正常运行：

const example2 = [
  {
    'title': 'Hello World',
    'Author': 'John Doe',
  },
  {
    'title': 'Hello World2',
    'Author': 'John Doe',
  },
];

外层需要保留对象的正确写法 #

如果你的需求是把这个数组作为对象的属性值，可以按如下方式修改：

const example2 = {
  // 显式声明属性名，后面跟数组值
  articleList: [
    {
      'title': 'Hello World',
      'Author': 'John Doe',
    },
    {
      'title': 'Hello World2',
      'Author': 'John Doe',
    },
  ]
};

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