为何单独执行{a}.a会报错，嵌入表达式中却无异常？

我在学习对象初始化（Object Initializer）时，遇到了如下示例：

const a = "foo";
const b = 42;
const c = {};

// 简写属性名
const o = { a, b, c };

// 换句话说
console.log(o.a === { a }.a); // true

令我感到困惑的是，{a}.a单独执行时会报错，但嵌入到表达式中却能正常运行：

const a = "foo";
const b = 42;
const c = {};

// 简写属性名
const o = { a, b, c };

// 换句话说
console.log(o.a === { a }.a); // true

console.log({a}.a); // 正常运行
"foo"; // 正常运行
// 但下面这行会报错
{a}.a; 

请问为何会出现这种差异？

核心原因是JavaScript对语句和表达式的解析规则不同：

• 当{a}.a出现在表达式上下文（比如console.log()的参数、比较运算符的一侧）时，JS引擎会把{a}解析成一个对象字面量（表达式），后面的.a是访问该对象的a属性，整个代码合法。
• 但当{a}.a单独作为一行时，JS引擎会优先把开头的{解析成代码块的起始标记（语句），此时a}会被当成语法错误——因为代码块里的a不是合法的语句，后面的.a更是完全不符合代码块的语法结构，所以直接报错。

如果想让单独的{a}.a合法运行，你可以给它套个括号，强制JS引擎按表达式解析：

({a}.a); // 正常运行，括号让内部被解析为对象表达式

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