Type error on Array.Reduce

Question

I cannot seem to figure out why I am getting an error when trying to do some object transformation.

What I am trying to do is take an array of items and using the Array.Reduce method create a new object based off a field within the item. After that I am using the Object.entries.map method to create a new array so I can later iterate over the objects. Code is below.

export interface IMenuItem {
    id: string;
    name: string;
    description: string;
    category: string;
    imageUrl: string;
    quantity: number;
}

function toItemGroups(items: IMenuItem[]): [{ items: {}; label: string }] {
    const groups: {} = items.reduce((result, item) => {
        const group: [{}] = result[item.category] || [];
        result[item.category] = group.concat(item);
        return result;
    }, {});

    return Object.entries(groups).map(([label, items]) => ({ items, label }));
}

The error that I am getting is:

type { items: IMenuItem[]; label: string }[] is not assignable to type [{ items: {}; label: string }].

This is pretty self explanatory but I cannot seem to figure out what types I need to get this to map correctly.

Any suggestions would be greatly appreciated.

Possibly because on one hand items is an array of IMenuItem whilst on the other its a simple object? — ste2425
– ste2425, Commented May 30, 2018 at 14:55
Why are you returning [{ items: {}; label: string }] instead of { items: {}; label: string }[] ? — Josu Goñi
– Josu Goñi, Commented May 30, 2018 at 15:08

Buh Buh · Accepted Answer · 2018-05-30 15:15:23Z

3

It told you want type it was expecting so just use that in your function declaration:

function toItemGroups(items: IMenuItem[]): { items: IMenuItem[]; label: string }[] {

Note that you want the [] at the end of the type, to mean array.

[{ items: IMenuItem[]; label: string }] would have meant tuple (or an array of length one)

answered May 30, 2018 at 15:15

Buh Buh

7,5262 gold badges38 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

enail131 Over a year ago

ahhhh this makes much more sense. thank you for your explanation. The syntax of an array of objects is a little confusing but your explanation helps.

enail131 Over a year ago

I'm now getting the following error when I change my return type to: { items: IMenuItem[]; label: string }[] { items: {}; label: string;}[] is not assignable to { items: IMenuItem[]; label: string }[] It's probably something to do with the types that the groups and group are but still can't seem to figure it out

WayneC · Accepted Answer · 2018-05-30 15:13:15Z

1

Your return type for toItemGroups() is [{ items: {}; label: string }] it should be { items: IMenuItem[]; label: string }[]. the items in the return type is an array of IMenuItem

edited May 30, 2018 at 15:13

answered May 30, 2018 at 15:07

WayneC

5,7402 gold badges35 silver badges44 bronze badges

Collectives™ on Stack Overflow

Type error on Array.Reduce

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related