如何在JavaScript响应对象访问路径中拼接变量获取动态属性值

你的需求完全可以实现，原写法属于语法错误：JavaScript 的点操作符仅支持访问静态固定的属性名，无法直接拼接变量动态生成属性名，你需要改用方括号属性访问语法实现需求。

核心实现逻辑 #

方括号内可以传入任意表达式，表达式的计算结果会自动转为字符串作为属性名，你有两种写法可选：

1. 先拼接生成属性名再传入：

// 先构造动态属性名
const targetProp = `t${variable}`
// 用方括号访问动态属性
const monthGrossReq = response.response.body.result.company.data[targetProp].month_col_val[o]

2. 直接在方括号内写模板字符串：

const monthGrossReq = response.response.body.result.company.data[`t${variable}`].month_col_val[o]

优化建议 #

可以加可选链操作符避免属性不存在时抛出错误，兼容性更好：

const monthGrossReq = response.response.body.result.company.data[`t${variable}`]?.month_col_val?.[o]

修改后的完整业务代码 #

for (let o = 0; o < 12; o++) {
    cy.get($el).find('.month-data-cols').eq(o).invoke('text').then($text => {
        let monthGross = $text
        // 替换为方括号动态属性访问即可
        let monthGrossReq = response.response.body.result.company.data[`t${variable}`].month_col_val[o]
        monthGross = monthGross.toString().replace(/,/g, '').trim();
        expect(monthGross).to.include(monthGrossReq);
    })
};

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