在JavaScript中将扁平化JSON转换为嵌套JSON的实现方案

嘿，刚入门JavaScript就尝试编写通用分组工具，这想法很棒！你当前的代码在分组逻辑和属性引用上存在一些小问题，我来帮你梳理出正确的实现方案～

你的代码存在的核心问题 #

• 直接使用数组topNFormat存储分组数据不合适：数组索引是数字类型，用timestamp字符串当索引会导致逻辑混乱，应该先用对象做映射完成分组，最后再转为目标数组。
• 属性引用错误：topNFormat[timestamp]这种写法会把timestamp当作变量，但你实际要访问的是字符串键名，应该结合当前遍历项的属性值来操作。
• 没有为每个分组单独维护result数组：你的代码里topNFormat[result]是全局的，会导致所有分组的数据混在一起，每个timestamp对应的result应该是独立的数组。

正确的实现方法（高效分步版） #

我们先通过临时对象完成分组映射，再转换为目标数组，这种方法性能更优，适合数据量较大的场景：

// 假设你的原始数据存储在这个变量中
const firstResult = [
  {"timestamp":"2019-01-01T00:00:00.000Z","MarketShare":89905.0,"Territory":"PHILADELPHIA PA"},
  {"timestamp":"2019-01-01T00:00:00.000Z","MarketShare":82991.0,"Territory":"SEATTLE WA"},
  {"timestamp":"2019-02-01T00:00:00.000Z","MarketShare":73662.0,"Territory":"PHILADELPHIA PA"},
  {"timestamp":"2019-02-01T00:00:00.000Z","MarketShare":67059.0,"Territory":"SEATTLE WA"},
  {"timestamp":"2019-03-01T00:00:00.000Z","MarketShare":72898.0,"Territory":"PHILADELPHIA PA"},
  {"timestamp":"2019-03-01T00:00:00.000Z","MarketShare":68013.0,"Territory":"SEATTLE WA"},
  {"timestamp":"2019-04-01T00:00:00.000Z","MarketShare":74607.0,"Territory":"PHILADELPHIA PA"},
  {"timestamp":"2019-04-01T00:00:00.000Z","MarketShare":66769.0,"Territory":"SEATTLE WA"},
  {"timestamp":"2019-05-01T00:00:00.000Z","MarketShare":93932.0,"Territory":"PHILADELPHIA PA"},
  {"timestamp":"2019-05-01T00:00:00.000Z","MarketShare":86514.0,"Territory":"SEATTLE WA"}
];

// 1. 创建临时映射对象，键为timestamp值，值为对应分组对象
const groupMap = {};

// 2. 遍历原始数组完成分组
for (const item of firstResult) {
  const { timestamp, MarketShare, Territory } = item;
  
  // 3. 如果当前timestamp未在映射中，初始化分组结构
  if (!groupMap[timestamp]) {
    groupMap[timestamp] = {
      timestamp,
      result: []
    };
  }
  
  // 4. 将当前项的MarketShare和Territory加入对应分组的result数组
  groupMap[timestamp].result.push({ MarketShare, Territory });
}

// 5. 将映射对象的所有值转为数组，得到最终结果
const topNFormat = Object.values(groupMap);

console.log(topNFormat);

更简洁的现代写法（使用Array.reduce） #

如果数据量不大，也可以用数组的reduce方法实现，代码更简洁直观：

const topNFormat = firstResult.reduce((acc, item) => {
  const { timestamp, MarketShare, Territory } = item;
  
  // 查找当前timestamp对应的分组
  const existingGroup = acc.find(group => group.timestamp === timestamp);
  
  if (existingGroup) {
    // 分组已存在，追加数据到result
    existingGroup.result.push({ MarketShare, Territory });
  } else {
    // 分组不存在，创建新分组并加入累加器
    acc.push({
      timestamp,
      result: [{ MarketShare, Territory }]
    });
  }
  
  return acc;
}, []); // 初始值为空数组

console.log(topNFormat);

两种写法都能输出你预期的结构，按需选择即可～

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