array.groupBy in Typoskript

Die grundlegenden array-Klasse hat .map, .forEach, .filter, und .reduce, aber .groupBy ich merklich abwesend, hindert mich daran, etwas zu tun, wie

const MyComponent = (props:any) => {
    return (
        <div>
            {
                props.tags
                .groupBy((t)=>t.category_name)
                .map((group)=>{
                    [...]
                })
            }

        </div>
    )
}

Ich landete Umsetzung, selbst etwas:

class Group<T> {
    key:string;
    members:T[] = [];
    constructor(key:string) {
        this.key = key;
    }
}


function groupBy<T>(list:T[], func:(x:T)=>string): Group<T>[] {
    let res:Group<T>[] = [];
    let group:Group<T> = null;
    list.forEach((o)=>{
        let groupName = func(o);
        if (group === null) {
            group = new Group<T>(groupName);
        }
        if (groupName != group.key) {
            res.push(group);
            group = new Group<T>(groupName);
        }
        group.members.push(o)
    });
    if (group != null) {
        res.push(group);
    }
    return res
}

So, jetzt kann ich tun

const MyComponent = (props:any) => {
    return (
        <div>
            {
                groupBy(props.tags, (t)=>t.category_name)
                .map((group)=>{
                    return (
                        <ul key={group.key}>
                            <li>{group.key}</li>
                            <ul>
                                {
                                    group.members.map((tag)=>{
                                        return <li key={tag.id}>{tag.name}</li>
                                    })
                                }
                            </ul>
                        </ul>
                    )
                })
            }

        </div>
    )
}

Funktioniert Recht gut, aber es ist schade, dass ich wickeln Sie die Liste eher als nur in der Lage, um die Methodenaufrufe verketten.

Gibt es eine bessere Lösung?

typescript fügt keine polyfills für die ES6-standard-Bibliothek ändert. Wenn Sie möchten, bekommen Sie diese natürlich auch ich würde vorschlagen, die Suche in core.js 🙂

InformationsquelleAutor Eldamir | 2017-02-09

Schreibe einen Kommentar