sortering - Sortera en array av objekt baserat på egenskap i TypeScript

Jag visar en array med objekt av typen 'request' i en tabell. Jag vill sortera kolumnerna i tabellen, så jag planerade att göra en klickmetod för varje kolumnrubrik. Denna metod sorterar arrayen baserat på värdet av egenskapen som visas i den kolumnen.

public sortProduct(): void {

    this.requests.sort((a, b) => {
        if (a.productName < b.productName)
            return -1;
        if (a.productName > b.productName)
            return 1;
        return 0;
    });

    if (!this.productSortOrder) {
        this.requests.reverse();
        this.productSortOrder = true;
    } else {
        this.productSortOrder = false;
    }        
}

Det här fungerar, men nu behöver jag göra en metod för varje kolumn. Jag letar efter ett sätt att anropa en sorteringsmetod på detta sätt:

this.requests.sortMethod(property, order);

Denna metod skulle sedan sortera requests-arrayen baserat på egenskapen hos objekten i arrayen och i den givna sorteringsordningen. Hur kan jag göra det? Jag antar att jag letar efter något som Func<> i C#.

Svar #1

Du kan använda en funktionssignatur för en liknande effekt som Func

sortProduct<T>(prop: (c: Product) => T, order: "ASC" | "DESC"): void {
    this.requests.sort((a, b) => {
        if (prop(a) < prop(b))
            return -1;
        if (prop(a) > prop(b))
            return 1;
        return 0;
    });

    if (order === "DESC") {
        this.requests.reverse();
        this.productSortOrder = true;
    } else {
        this.productSortOrder = false;
    }        
}
// Usage
sortProduct(p=> p.productName, "ASC");

Eller så kan du använda egenskapsnamnet istället (keyof Product kommer att säkerställa att strängen måste vara en egenskap av Product):

sortProduct<T>(propName: keyof Product, order: "ASC" | "DESC"): void {
    this.requests.sort((a, b) => {
        if (a[propName] < b[propName])
            return -1;
        if (a[propName] > b[propName])
            return 1;
        return 0;
    });
    ...
} 
// Usage
sortProduct("productName", "ASC");
sortProduct("productName_", "ASC"); // Error

Svar #2

Du kan använda en SortUtil-klass med en statisk mallmetod sortByProperty:

export class SortUtil {

    static sortByProperty<T>(array: T[], propName: keyof T, order: 'ASC' | 'DESC'): void {
        array.sort((a, b) => {
            if (a[propName] < b[propName]) {
                return -1;
            }

            if (a[propName] > b[propName]) {
                return 1;
            }
            return 0;
        });

        if (order === 'DESC') {
            array.reverse();
        }
    }
}

Relaterade artiklar