js数组对象中将相同的数据类型归类

初始数据

[
  {
          
   
    id: 1,
    name: IP,
    value: 1,
    category: 类型1
  },
  {
          
   
    id: 2,
    name: IP1,
    value: 0,
    category: 类型1
  },
  {
          
   
    id: 3,
    name: mac,
    value: 4,
    category: mac地址
  }
]

最终数据

[
  {
          
   
    category: 类型1,
    children: [
      {
          
   
        id: 1,
        name: IP,
        value: 1
      },
      {
          
   
        id: 2,
        name: IP1,
        value: 0
        }
    ]
  },
  {
          
   
    category: mac地址,
    children: [
      {
          
   
        id: 3,
        name: mac,
        value: 4
      }
    ]
  }
]

转化代码

arrayTransfer(data) {
          
   
  const resultArr = []
  data.forEach(function (el) {
          
   
    let obj = {
          
   
      name: el.protocolName,
      value: el.protocolValue,
      layer: el.protocolLayer,
      count: el?.count || 0
    }
    if ([null, undefined, ].includes(el.protocolCategory) || el.protocolCategory === 其他协议) {
          
   
      el.protocolCategory = 其他协议
    }
    for (let i = 0; i < resultArr.length; i++) {
          
   
      if (resultArr[i].protocolCategory === el.protocolCategory) {
          
   
        resultArr[i].children.push(obj)
        return
      }
    }
    resultArr.push({
          
   
      protocolCategory: el.protocolCategory,
      children: [obj]
    })
  })
  return resultArr
}

js数组列表中,将time的值相同的字段分成一组

如`[{time:1, name: 1 }, {time: 1, name: 2}, {time:3, name:4}]`变为`[{time:1, children: [{time:1, name: 1},{time: 1, name: 2}] }, , {time:3, name:4}]` 实现:

const arr = [{
          
   time: 1, name: 1 }, {
          
   time: 1, name: 2}, {
          
   time:3, name:4}];

const result = Object.values(arr.reduce((acc, cur) => {
          
   
  const {
          
   time, ...rest} = cur;
  if (acc[time]) {
          
   
    acc[time].children.push(rest);
  } else {
          
   
    acc[time] = {
          
   time, children: [rest]};
  }
  return acc;
}, {
          
   }));

console.log(result); // [{time: 1, children: [{time: 1, name: 1}, {time: 1, name: 2}]}, {time: 3, children: [{time: 3, name: 4}]}]

解析:

    arr.reduce((acc, cur) => {}, {})用于遍历原始数组,并将结果收集到一个对象中,初始值为一个空对象 {}。 const {time, ...rest} = cur利用解构将 time 和其余属性分开。 if (acc[time]) {} else {}判断该 time 值是否存在于结果对象中,如存在则将新元素 rest 添加到已有 time 对应对象的 children 数组中,如不存在则新建一个带有 time 和空的 children 数组的对象,并将该元素 rest 添加到 children 数组中。 Object.values 获取结果对象的所有值,即将结果对象中的所有对象组成的数组。 最后将所有的记录下来的对象转换为最终的目标数组并返回。
经验分享 程序员 微信小程序 职场和发展