如何按指定映射顺序填充JSON对象为数组并支持动态配置？

一、基础顺序提取方案 #

你之前用for...in遍历对象键的方式不可靠——虽然ES6+对对象键的遍历顺序有了规范，但直接依赖它不如明确指定提取顺序更稳妥。我们可以用一个「目标顺序数组」来约束取值顺序，代码如下：

// 原始数据源
const columns = [
  { 'name': 'value', 'id': 1, 'age': 15 },
  { 'name': 'value1', 'id': 2, 'age': 18 }
];
// 定义你需要的取值顺序
const targetOrder = ['id', 'age', 'name'];

// 生成结果数组
const output = columns.map(item => {
  // 对每个对象，按目标顺序取出对应值
  return targetOrder.map(key => item[key]);
});

console.log(output);
// 输出：[[1, 15, 'value'], [2, 18, 'value1']]

这个方案的核心是用map遍历目标顺序数组，确保每一项的取值顺序完全符合你的需求，彻底解决for...in带来的顺序不确定性问题。

二、动态映射配置实现 #

针对你提出的「将映射规则定义在变量中实现动态替换」的需求，我们可以把映射配置封装成一个对象，直接复用配置里的顺序规则即可。推荐用数组格式存储顺序（比字符串解析更可靠），示例如下：

// 动态映射配置：把顺序规则单独存放在变量中
const mappingConfig = {
  extractOrder: ['id', 'age', 'name'] // 核心是这个顺序数组
};

const columns = [
  { 'name': 'value', 'id': 1, 'age': 15 },
  { 'name': 'value1', 'id': 2, 'age': 18 }
];

// 基于动态配置生成结果
const result = columns.map(item => {
  return mappingConfig.extractOrder.map(key => item[key]);
});

console.log(result);
// 输出和基础方案完全一致

如果你因为特殊需求必须用字符串格式的配置（比如从后端接口获取的是字符串），可以先把字符串解析成数组再使用：

// 字符串格式的映射配置
const mapping = {
  columns: '{name, id, age}',
  mapping: '[id, age, name]'
};

// 解析顺序字符串为数组（注意格式要严格）
const parsedOrder = mapping.mapping
  .replace(/\[|\]|\s/g, '') // 去掉括号和多余空格
  .split(',');

const columns = [
  { 'name': 'value', 'id': 1, 'age': 15 },
  { 'name': 'value1', 'id': 2, 'age': 18 }
];

const result = columns.map(item => parsedOrder.map(key => item[key]));
console.log(result);

⚠️ 注意：字符串解析方式对格式要求很高（比如不能有多余的引号、不规则空格），所以优先推荐用数组格式的配置。

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