处理JSON时如何使用字符串模板动态获取prodConfig或draftConfig属性？

问题原因 #

• 点号属性访问符会直接将后面的标识符作为固定属性名查找，不会解析变量的值：你写data.businesses_by_pk.configFile时，JS实际是在找名叫configFile的属性，而不是找你变量configFile存储的prodConfig/draftConfig属性，因此返回undefined。
• 用Object.keys(...)[1]按下标取键的方式极不稳定，JS对象的键排序存在规则差异，一旦后续接口返回的对象属性顺序变化，会直接取错值。

正确实现 #

方案1：方括号动态属性访问（推荐，适配你现有拿键的逻辑） #

方括号语法支持传入变量/表达式作为属性名，会自动解析取值：

// 先精准匹配目标键，避免下标取值的不稳定问题
const configKey = Object.keys(data.businesses_by_pk).find(key => key === 'prodConfig' || key === 'draftConfig')
const header = data.businesses_by_pk[configKey]

方案2：空值合并运算符简写（更简洁，无需提前拿键） #

如果确定对象中只会存在两个配置键的其中一个，可以直接用空值合并运算符判断取值：

const header = data.businesses_by_pk.prodConfig ?? data.businesses_by_pk.draftConfig

如果你的运行环境不支持??运算符，也可以用逻辑或替换：

const header = data.businesses_by_pk.prodConfig || data.businesses_by_pk.draftConfig

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