js后台返回对象根据fileName分类遍历方法优化？

Question

后台返回的数据如下

[
  {
    "fileName": "XX_NCS_FBC_20230827_2023082709_NMFC.doc",
    "fileNameType": "灾害警报",
    "message": "2023年 8 月 27 日 09 时               签发：发布null",
    "publishTime": "2023年 8 月 27 日 09 时               签发：",
    "remark": "灾害警报(风暴潮消息)",
    "type": "1"
  },
  {
    "fileName": "XX_SD_FBC_20230827_2023082709_SDMF.doc",
    "fileNameType": "灾害警报",
    "message": "2023年 8 月 27 日 09 时               签发：发布null",
    "publishTime": "2023年 8 月 27 日 09 时               签发：",
    "remark": "灾害警报(风暴潮消息)",
    "type": "1"
  },
  {
    "fileName": "XX_NCS_HL_23082708_NMFC.doc",
    "fileNameType": "灾害警报",
    "message": "2023年8月27日08时                   签发：发布null",
    "publishTime": "2023年8月27日08时                   签发：",
    "remark": "灾害警报(海浪消息)",
    "type": "1"
  },
  {
    "fileName": "JB_NCS_HL_B2023082701_2023082714_NMFC.doc",
    "fileNameType": "灾害警报",
    "level": "海浪蓝色警报",
    "message": "2023年8月27日14时发布海浪蓝色警报",
    "publishTime": "2023年8月27日14时",
    "remark": "灾害警报(海浪警报)",
    "type": "1"
  },
  {
    "fileName": "JB_SD_FBC_BWD23082701_2023082716_SDMF.doc",
    "fileNameType": "灾害警报",
    "level": "风暴潮Ⅳ级警报（蓝色）",
    "message": "2023年08月27日16时发布风暴潮Ⅳ级警报（蓝色）",
    "publishTime": "2023年08月27日16时",
    "remark": "灾害警报(风暴潮警报)",
    "type": "1"
  },
  {
    "fileName": "JB_NCS_FBC_BWD23082701_2023082716_NMFC.doc",
    "fileNameType": "灾害警报",
    "level": "风暴潮Ⅳ级警报（蓝色）",
    "message": "2023年08月27日16时发布风暴潮Ⅳ级警报（蓝色）",
    "publishTime": "2023年08月27日16时",
    "remark": "灾害警报(风暴潮警报)",
    "type": "1"
  },
  {
    "fileName": "JB_NCS_FBC_BWD23082702_2023082808_NMFC.doc",
    "fileNameType": "灾害警报",
    "level": "风暴潮Ⅳ级警报（蓝色）",
    "message": "2023年08月28日08时发布风暴潮Ⅳ级警报（蓝色）",
    "publishTime": "2023年08月28日08时",
    "remark": "灾害警报(风暴潮警报)",
    "type": "1"
  },
  {
    "fileName": "JB_SD_FBC_BWD23082702_2023082808_SDMF.doc",
    "fileNameType": "灾害警报",
    "level": "风暴潮Ⅳ级警报（蓝色）",
    "message": "2023年08月28日08时发布风暴潮Ⅳ级警报（蓝色）",
    "publishTime": "2023年08月28日08时",

要求前台根据flieName进行分类 fileName包含FBC的，放到fbc的数组里，包含HL的放到hl的数组里......以此类推加各种条件分类

现在用的是map 加 indexOf进行push 求教有没有更优雅的方法

Answer 1

我的思路是维护一个listMap用来解耦业务代码，方便后期维护的时候添加文件类型，具体的业务实现感觉没有太多能优化的空间

const listMap = {
    fbc: [],
    hl: [],
}

data.map(itm => {
    for (let key in listMap) {
        if (itm.fileName.indexOf(key.toUpperCase()) !== -1) {
            listMap[key].push(itm)
        }
    }
})

Answer 2

我觉的可以使用 reduce 这个方法，后期会更容易维护 代码如下：

let map = arr.reduce((fileNameMap, fileItem) => {
  const fileItemName = fileItem['fileName'].split('_')[2].toLowerCase()
  if(!fileNameMap.hasOwnProperty(fileItemName)){
    fileNameMap[fileItemName] = []
  }
  fileNameMap[fileItemName].push(fileItem)
  return fileNameMap
},{})

Answer 3

function classify(inputArr, classArr) {
  const result = {}; // { FBC: [], HL: [], unused: [] }

  inputArr.forEach(item => {
    const keyword = classArr.find(keyword => item.fileName.includes(keyword));
    if (keyword) {
      result[keyword] = result[keyword] || [];
      result[keyword].push(item);
    } else {
      result.unused = result.unused || [];
      result.unused.push(item);
  });

  return result;
}

const classArr = ["FBC", "HL"]; 
const classifiedData = classify(inputArr, classArr);

console.log(classifiedData);