首页 > 解决方案 > Typescript 按键分组数组

问题描述

如何键入 reduce 函数参数。

interface IGroupArrayByKey<T> {
    data: T[]
    key: string
}

export const groupArrayByKey = <T>({ data, key }: IGroupArrayByKey<T>): object => {
    return data.reduce((acc: any, item: any) => {
        return { ...acc, [item[key]]: [...(acc[item[key]] || []), item] }
    }, {})
}

groupArrayByKey函数的工作原理是您将数组作为 a 提供,date并且key该数组应分组

标签: javascripttypescript

解决方案


几点注意事项:

  1. keyof T列出 T 类型的所有属性,并且不允许传递不是该对象键的任意字符串。非常有用的恕我直言。
  2. 我们不能保证它item[keyProp]是字符串,但对象中的索引器只能是字符串或数字。这就是为什么这么丑as unknown as string。如果你会使用 a Map,那么我们就不需要演员表了。
interface IGroupArrayByKey<T> {
    data: T[]
    keyProp: keyof T
}

export const groupArrayByKey = <T>({ data, keyProp }: IGroupArrayByKey<T>) => {
    return data.reduce<{ [key: string]: T[] }>((acc, item) => {
        const key = item[keyProp] as unknown as string;
        return { ...acc, [key]: [...(acc[key] || []), item] }
    }, {})
}

推荐阅读