如何将JSON对象数组转置为键值对列表？

在数据处理过程中，JSON对象数组是一种常见的结构，例如从接口拿到的用户列表。但某些场景我们需要将它转置为键值对列表，也就是每一项变成包含字段名和字段值的对象，方便统一展示或提交。下面通过示例说明具体做法。

什么是JSON对象数组转置为键值对列表

假设原始数据是一个对象数组，每个对象拥有相同的键。转置后，我们希望得到类似如下结构：把每个对象的每个属性拆出来，形成 { key: 字段名, value: 字段值 } 这样的列表项，再平铺到一个数组里。

原始数据示例

// 原始JSON对象数组
const users = [
  { name: '张三', age: 28, city: '北京' },
  { name: '李四', age: 34, city: '上海' }
];

目标键值对列表

// 转置后的键值对列表
const result = [
  { key: 'name', value: '张三' },
  { key: 'age', value: 28 },
  { key: 'city', value: '北京' },
  { key: 'name', value: '李四' },
  { key: 'age', value: 34 },
  { key: 'city', value: '上海' }
];

使用JavaScript实现转置

核心思路是遍历数组中的每一个对象，通过 Object.keys 拿到键名，再用 map 把键值映射成目标结构，最后用 flatMap 将多层数组合并。

基础实现代码

function transposeToKeyValueList(arr) {
  // 使用flatMap遍历每个对象并展开结果
  return arr.flatMap(function(item) {
    return Object.keys(item).map(function(k) {
      return { key: k, value: item[k] };
    });
  });
}

const users = [
  { name: '张三', age: 28, city: '北京' },
  { name: '李四', age: 34, city: '上海' }
];

const list = transposeToKeyValueList(users);
console.log(list);

处理嵌套对象的注意事项

如果对象里还有嵌套对象，上面的简单写法会把整个子对象作为 value。此时可以写一个递归函数，遇到值为对象的情况继续展开。

function deepTranspose(arr, prefix) {
  prefix = prefix || '';
  return arr.flatMap(function(item) {
    return Object.keys(item).map(function(k) {
      var val = item[k];
      var fullKey = prefix ? prefix + '.' + k : k;
      if (val && typeof val === 'object' && !Array.isArray(val)) {
        // 递归处理嵌套对象
        return deepTranspose([val], fullKey);
      }
      return { key: fullKey, value: val };
    });
  });
}

const data = [
  { name: '张三', info: { age: 28, city: '北京' } }
];
console.log(deepTranspose(data));

在Python中如何实现

后端同学如果用Python，也可以很容易完成同样的逻辑。借助列表推导式即可。

users = [
    {'name': '张三', 'age': 28, 'city': '北京'},
    {'name': '李四', 'age': 34, 'city': '上海'}
]

result = [
    {'key': k, 'value': v}
    for item in users
    for k, v in item.items()
]
print(result)

小结

将JSON对象数组转置为键值对列表并不复杂，前端用 JavaScript 的 flatMap 与 Object.keys，后端用 Python 的字典推导都能快速实现。遇到嵌套结构时加上递归即可。掌握这种转换，能让数据适配和报表类需求变得更轻松。

JSON数组转置键值对JavaScript数据处理修改时间：2026-07-25 14:09:20