ES6如何从两种结构的JavaScript payload中统一获取firstName属性

统一获取属性的ES6实现方案 #

可以通过嵌套解构搭配默认值的语法，一行代码兼容两种结构的取值需求：

const { firstName, personalDetails: { firstName = firstName } = {} } = payload;

逻辑说明 #

• 优先提取payload顶层的firstName属性
• 给personalDetails设置默认空对象{}，避免第一种结构无该属性时解构报错
• 提取personalDetails下的firstName时，默认值回退为上一步拿到的顶层firstName：如果嵌套属性存在就覆盖原有值，不存在就直接沿用顶层取值

如果偏好可读性更高的写法，可以用可选链+空值合并运算符的组合（ES2020特性，现代运行环境全支持）：

const firstName = payload.firstName ?? payload.personalDetails?.firstName;

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