JavaScript中如何通过动态键获取JSON值？

问题描述 #

我有如下结构的JSON对象（TypeScript类型定义）：

matrix: {
    nog: {
        moves: number[][];
        scale: number;
    };
    eyes: {
        moves: number[][];
        scale: number;
    };
    // 其他属性...
}

存在变量art，值可能为'nog'、'eyes'或其他属性名，希望用类似matrix.[art]的方式提取对应属性数据，不想用switch，要更优雅可扩展的方法。

解决方案 #

在JavaScript/TypeScript中，直接使用方括号语法就能实现通过变量访问对象属性，这是最原生且可扩展的方案：

基础JavaScript用法 #

直接通过变量作为键名，用方括号包裹访问：

const targetData = matrix[art];
// 后续可直接访问targetData.moves或targetData.scale

TypeScript类型安全处理 #

如果是TypeScript环境，为了保证类型校验和代码提示，可以先约束变量的合法取值：

// 提取matrix的所有键作为合法类型
type MatrixKey = keyof typeof matrix;
// 约束art只能是matrix的合法属性名
const art: MatrixKey = 'nog'; // 或 'eyes' 等
// 此时访问matrix[art]会自动获得对应属性的类型提示
const targetData = matrix[art];

这种方式无需额外判断逻辑，新增属性时也不用修改访问代码，完全满足可扩展需求，比switch简洁高效得多。

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