Loop through array of objects, if value exists, return another value

May 24, 2022

With the information below I am trying loop through cards, if there is a nested object of helper, return that objects title. But am either receiving undefined or errors. I was thinking maybe reduce would be viable here?

Sample Array:

cards: [
    0: {
        title: 'Something',
        logo: 'logo link here',
    },
    1: {
        title: 'Something 2',
        logo: 'logo link here',
        helper: {
            text: 'helper text',
        },
    },
    2: {
        title: 'Something 3',
        logo: 'logo link here',
    },
]

code:

cards.filter((item) => {
    if (item.helper) setHelperActive({...helperActive, item.title: true}) 
})

>Solution :

Using .filter() and checking if the object has a prop named helper. In case of multiple objects matching the criteria, their title’s will be joined as a comma-separated string.

Snippet

let cards = [
    {
        title: 'Something',
        logo: 'logo link here',
    },
    {
        title: 'Something 2',
        logo: 'logo link here',
        helper: {
            text: 'helper text',
        },
    },
    {   
        title: 'Something',
        logo: 'logo link here',
    },
    {
        title: 'Something 4',
        logo: 'logo link here',
        helper: {
            text: 'helper text',
        },
    },
]

// to list titles from all matching objects as a comma-separated string
console.log(cards.filter(ob => 'helper' in ob).map(({ title }) => title).join());

// suppose only the first matched object's title is required
console.log(cards.find(ob => 'helper' in ob)?.title ?? 'no match found');