javascript - 对数组项进行分组,但关键是数组

标签 javascript jquery arrays reactjs group-by

按其属性之一对数组项进行分组,问题是该属性是数组。

规则: 该属性中的每个项目必须相同才能使其位于单个组中。

示例数组:

 [{name:'classOne',id:"c1",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"}]},
 {name:'classTwo',id:"c2",student:[{name:'student1',id:"student1"}]},
{name:'classThree',id:"c3",student:[{name:'student3',id:"student3"}]},
{name:'classFour',id:"c4",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"}]},
{name:'classFive',id:"c4",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"},{name:'student3',id:"student3"}]}
]

预期输出:

{
    key1:[
        {name:'classOne',id:"c1",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"}]
        {name:'classFour',id:"c4",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"}]
    ],
    key2:[
        {name:'classTwo',id:"c2",student:[{name:'student1',id:"student1"}]},
    ],
    key3:[
        {name:'classThree',id:"c3",student:[{name:'student3',id:"student3"}]},
    ],
    key4:[
        {name:'classFive',id:"c4",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"},{name:'student3',id:"student3"}]}
    ]
}

我的示例函数

export function groupByArrayKey<T>(key: string, arrayValue: T[]) {
    let result = {};
    return arrayValue.reduce((result, currentVal) => {
        const currentArray = getDeepValue(currentVal, key);
        const resultKey = currentArray[0].id;
        const keyWithLen = resultKey + currentArray.length;
        if (resultKey in result) {
            const resultArray = getDeepValue(result[resultKey][0], key);
            const isEql = isEqual(resultArray, currentArray);
            if (isEql) {
                (result[resultKey] = result[resultKey] || []).push(currentVal);
            } else {
                (result[keyWithLen] = result[keyWithLen] || []).push(currentVal);
            }
        } else if (keyWithLen in result) {
            const resultArray = getDeepValue(result[keyWithLen][0], key);
            const isEql = isEqual(resultArray, currentArray);
            if (isEql) {
                delete result[keyWithLen];
                (result[resultKey] = result[resultKey] || []).push(resultArray, currentVal);
            } else {
                const dummyKey = Math.random();
                (result[dummyKey] = result[dummyKey] || []).push(currentVal);
            }
        } else {
            console.log('third');

            (result[resultKey] = result[resultKey] || []).push(currentVal);
        }
        return result;
    }, {});
}

期望最终输出可以是“数组的数组”/“数组的对象”,任何都可以。

分组依据:学生

下面的函数可以工作,但是,还有其他方法可以以紧凑的方式编写它吗?

最佳答案

一种选择是创建一个对象,其属性是字符串化的 student。在输入的每次迭代中,对学生进行字符串化以找到要查找的键。如果对象上不存在该键,则在其中创建一个数组。然后推送到数组。

例如,输入对象 { name: 'name', Student: ['a', 'b'] } 作为输入数组中的第一项,将导致该对象看起来像在第一次迭代中就像这样:

{
  '["a","b"]': [{ name: 'name', student: ['a', 'b'] }]
}

最后,获取对象值:

const input = [
  {name:'classOne',id:"c1",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"}]},
  {name:'classTwo',id:"c2",student:[{name:'student1',id:"student1"}]},
  {name:'classThree',id:"c3",student:[{name:'student3',id:"student3"}]},
  {name:'classFour',id:"c4",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"}]},
  {name:'classFive',id:"c4",student:[{name:'student1',id:"student1"},{name:'student2',id:"student2"},{name:'student3',id:"student3"}]}
];

const groupByArrayKey = (key, inputArr) => {
  const outputArraysByStringifiedValue = {};
  for (const item of inputArr) {
    const key = JSON.stringify(item.student);
    if (!outputArraysByStringifiedValue[key]) outputArraysByStringifiedValue[key] = [];
    outputArraysByStringifiedValue[key].push(item);
  }
  return Object.values(outputArraysByStringifiedValue);
}

console.log(groupByArrayKey('student', input));

关于javascript - 对数组项进行分组,但关键是数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61026729/

相关文章:

jquery - 图像不会保持水平,它们堆叠为 2 行

php - 将字符串部分与数组值进行比较

javascript - 后期绑定(bind)onclick事件

c# - 在 JavaScript 中使异步事件同步

javascript - D3 强制布局颜色和缩放

javascript - 使用 Google Chrome 时启用 scrollX 或 scrollY 时数据表中出现重复的空标题

javascript - 利用浏览器缓存 |修改 .htaccess 文件 | - 不适用于 javascript 文件

javascript - 在 SPA 站点中保持 2 个导航菜单同步

python - 查找二维数组Python的长度

javascript - 存储每个元素的定位信息(JQuery/Javascript)