JavaScript中可选链（?.）操作符叠加的行为机制探究

?.的核心规则 #

?.是单步短路的属性访问操作符，只针对当前这一步做判断：

• 如果操作符左侧的值是null或undefined，直接返回undefined，不会执行右侧的属性访问。
• 如果左侧的值不是null/undefined，就和普通.一样，正常访问右侧属性。
• 注意：它只会短路当前这一步，不会影响后续的其他属性访问操作——后续如果用普通.访问null/undefined的属性，依然会报错。

对应你的实验结果逐一解释 #

1. a.n.n.n.n.n.n.n抛出TypeError
   a是空对象，a.n返回undefined，接下来用普通.访问undefined.n，符合普通.的报错规则，直接触发“无法读取undefined的属性”错误。

2. a?.n.n.n.n.n.n.n抛出TypeError
   a?.n这一步，因为a存在，所以返回a.n即undefined；后续的.n都是普通属性访问，访问undefined.n自然触发报错——这里?.只处理了a到n的访问，后续步骤没有?.保护，所以和第一个案例结果一致。

3. a?.n?.n.n.n.n.n.n的结果疑问
   按照正常逻辑，a?.n返回undefined，undefined?.n返回undefined，接下来的.n是访问undefined.n，应该触发TypeError。如果你的控制台确实返回undefined，大概率是输入时的笔误（比如后续的.n也写成了?.n）——只有所有属性访问都用?.保护时，才会一路返回undefined而不报错。

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