按time属性将对象数组分组为二维数组的技术需求

嘿，这个按time属性归类对象的需求很容易实现，我给你写个实用的JavaScript方案～

思路 #

核心就是用reduce方法先按time属性把对象归类到对应的组里，再把分组结果转换成二维数组。这种方法简洁高效，还能兼容输入里有多个键的情况。

代码实现 #

// 修正语法后的输入数据
const input = {
  "00:00": [
    {"id":1, "time": "00:05"},
    {"id":1, "time": "00:15"},
    {"id":1, "time": "00:20"},
    {"id":2, "time": "00:05"},
    {"id":3, "time": "00:05"},
    {"id":4, "time": "00:35"}
  ]
};

// 分组处理逻辑
const groupedOutput = {};

// 遍历输入中的每个键（支持多个键的场景）
for (const key in input) {
  const targetArray = input[key];
  // 使用reduce创建按time分组的临时对象
  const timeGroups = targetArray.reduce((acc, currentItem) => {
    // 如果当前time还没创建分组，初始化空数组
    if (!acc[currentItem.time]) {
      acc[currentItem.time] = [];
    }
    // 将当前对象加入对应time的分组
    acc[currentItem.time].push(currentItem);
    return acc;
  }, {});
  // 将分组对象的值转为数组，得到二维数组
  groupedOutput[key] = Object.values(timeGroups);
}

console.log(groupedOutput);

输出结果 #

运行后你会得到期望的结构：

{
  "00:00": [
    [{"id":1,"time":"00:05"},{"id":2,"time":"00:05"},{"id":3,"time":"00:05"}],
    [{"id":1,"time":"00:15"}],
    [{"id":1,"time":"00:20"}],
    [{"id":4,"time":"00:35"}]
  ]
}

代码解释 #

1. 遍历输入键：循环处理输入对象中的每个键（比如这里的"00:00"），确保代码能处理多个键的场景。
2. reduce分组：reduce方法会遍历目标数组，把每个对象根据time属性放到对应的分组数组里，最终得到一个以time为键、对象数组为值的临时对象。
3. 转为二维数组：用Object.values()提取临时对象的所有值，这些值就是按time分组后的子数组，组合起来就是我们需要的二维数组。

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