Jscript reduce() 根据某个(多个)字段分组生成一个新的数组或对象

最新推荐文章于 2024-11-10 22:45:39 发布

昕er

最新推荐文章于 2024-11-10 22:45:39 发布

阅读量910

点赞数 22

文章标签：前端 javascript

本文链接：https://blog.csdn.net/weixin_45638884/article/details/141888201

版权

代码解释

existing.stationName = ${item.stationName}($ {existing.sum});:
- 每次更新 sum 时，我们直接将 stationName 的值替换为 item.stationName 和最新的 sum，确保不会重复添加。
首次添加:
- 在新建对象时，我们初次将 stationName 设置为 stationName(1)。

输出结果

运行这段代码后，grouped 数组中的 stationName 将正确显示为 "stationName(sum)"，例如 "牡丹江1(2)"。

重点就是这个:

 const existing = acc.find(entry => entry.deviceId === item.deviceId);
  // entry.deviceId === item.deviceId 这个是单个 如果是多个就是需要下面这样
  // entry.deviceId === item.deviceId && entry.dept=== item.dept

const data = [
  { dept: "01", deptChaild: "01", stationName: "牡丹江1", deviceType: "1", deviceName: "1", deviceId: "1", alarmContent: "与服务器中断00", alarmLevel: "1" },
  { dept: "01", deptChaild: "01", stationName: "牡丹江1", deviceType: "1", deviceName: "1", deviceId: "1", alarmContent: "与服务器中断01", alarmLevel: "1" },
  { dept: "01", deptChaild: "01", stationName: "牡丹江2", deviceType: "1", deviceName: "1", deviceId: "2", alarmContent: "与服务器中断01", alarmLevel: "1" },
  { dept: "01", deptChaild: "01", stationName: "牡丹江3", deviceType: "1", deviceName: "1", deviceId: "3", alarmContent: "与服务器中断00", alarmLevel: "1" },
  { dept: "01", deptChaild: "01", stationName: "牡丹江2", deviceType: "1", deviceName: "1", deviceId: "2", alarmContent: "与服务器中断03", alarmLevel: "1" }
];
// 数组
const grouped = data.reduce((acc, item) => {
  const existing = acc.find(entry => entry.deviceId === item.deviceId);
  // entry.deviceId === item.deviceId 这个是单个 如果是多个就是需要下面这样
  // entry.deviceId === item.deviceId && entry.dept=== item.dept
  if (existing) {
    existing.sum += 1;
    existing.stationName = `${item.stationName}(${existing.sum})`;
  } else {
    acc.push({ ...item, sum: 1, stationName: `${item.stationName}(1)` });
  }
  
  return acc;
}, []/** 收集成数组*/);
// 对象
const groupedObj = data.reduce((acc, item) => {
  if (!acc[item.deviceId]) {
    acc[item.deviceId] = [];
  }
  acc[item.deviceId].push(item);
  return acc;
}, {}/** 收集成对象*/);
console.log(grouped);
/** 
[
    { "dept": "01",  "deptChaild": "01", "stationName": "牡丹江1(2)", "deviceType": "1", "deviceName": "1", "deviceId": "1", "alarmContent": "与服务器中断00", "alarmLevel": "1", "sum": 2 },
    { "dept": "01",  "deptChaild": "01", "stationName": "牡丹江2(2)", "deviceType": "1", "deviceName": "1", "deviceId": "2", "alarmContent": "与服务器中断01", "alarmLevel": "1", "sum": 2 },
    { "dept": "01", "deptChaild": "01", "stationName": "牡丹江3(1)", "deviceType": "1", "deviceName": "1", "deviceId": "3", "alarmContent": "与服务器中断00", "alarmLevel": "1", "sum": 1 }
] 
**/
console.log(groupedObj);
/**
{
    "1": [ {"dept": "01", "deptChaild": "01", "stationName": "牡丹江1", "deviceType": "1", "deviceName": "1", "deviceId": "1", "alarmContent": "与服务器中断00", "alarmLevel": "1" },
    	   {"dept": "01", "deptChaild": "01", "stationName": "牡丹江1", "deviceType": "1", "deviceName": "1", "deviceId": "1", "alarmContent": "与服务器中断01", "alarmLevel": "1" }
        ],
    "2": [ {"dept": "01","deptChaild": "01","stationName": "牡丹江2","deviceType": "1","deviceName": "1","deviceId": "2","alarmContent": "与服务器中断01","alarmLevel": "1"},
           {"dept": "01","deptChaild": "01","stationName": "牡丹江2", "deviceType": "1","deviceName": "1","deviceId": "2","alarmContent": "与服务器中断03","alarmLevel": "1"}
        ],
    "3": [{"dept": "01","deptChaild": "01","stationName": "牡丹江3","deviceType": "1","deviceName": "1","deviceId": "3","alarmContent": "与服务器中断00","alarmLevel": "1"}
        ]
}
**/