如何通过reduce聚合数据生成目录-文件结构数组？

我需要聚合文件数据，生成一个数组，每个元素是一个对象——键为目录名，对应值是该目录下的文件对象组成的数组，期望结构如下：

const output = [
  {
    directory1: [
      {
        ...filecontent,
      },
      {
        ...filecontent,
      },
    ],
  },
  {
    directory2: [
      {
        ...filecontent,
      },
      {
        ...filecontent,
      },
    ],
  },
];

我尝试用reduce实现，但没能得到预期输出，我的代码如下：

const output = files.reduce((acc: any[], file) => {
      const directory = getDirectory(file.uri);
      if (Object.keys(acc).includes(directory)) {
        acc[directory].push(file)
      } else {
        acc.push({ [directory]: file });
      }
      return acc;
    }, []);

问题分析与修复方案 #

你的代码核心问题是把数组acc当成对象来处理了：

• Object.keys(acc)获取的是数组的索引（比如"0"、"1"），不是目录名，所以永远匹配不到目标目录
• 新增目录时直接把file作为值，而非数组，后续的push操作会报错或无效

以下是修复后的代码：

const output = files.reduce((acc: any[], file) => {
  const directory = getDirectory(file.uri);
  // 在acc数组中查找包含当前目录名的对象
  const existingDirItem = acc.find(item => Object.keys(item)[0] === directory);

  if (existingDirItem) {
    // 找到则往对应目录的文件数组中添加当前文件
    existingDirItem[directory].push(file);
  } else {
    // 未找到则新增一个目录对象，值为包含当前文件的数组
    acc.push({ [directory]: [file] });
  }

  return acc;
}, []);

逻辑说明 #

1. 遍历每个文件时，先通过find方法在结果数组中查找是否已有对应目录的对象
2. 若存在，直接将当前文件推入该目录对应的数组中
3. 若不存在，则创建一个新的对象（键为目录名，值为包含当前文件的数组）并加入结果数组

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