遍历对象数组，如果值存在，return另一个值

Question

根据下面的信息，我正在尝试循环遍历 cards，如果存在对象 title 的 helper、return 的嵌套对象。但是我收到未定义或错误。我在想 reduce 在这里可行吗？

示例数组：

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',
    },
]

代码：

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

Answer 1

let cards = [
    {
        title: 'Something',
        logo: 'logo link here',
    },
    {
        title: 'Something else',
        logo: 'logo link here',
        helper: {
            text: 'helper text',
        },
    },
    {   
        title: 'Something',
        logo: 'logo link here',
    },
    {
        title: 'Lorem Epsum',
        logo: 'logo link here',
        helper: {
            text: 'helper text',
        },
    }
]

let filtered = []

for(let i = 0; i < cards.length; i++) {
    if(cards[i].helper) {
        filtered.push(cards[i].title)
    }
}
console.log(filtered);

Answer 2

解决方案是使用 map 而不是 filter 应该是这样的： var titles = cards.map(card=>{ return card.title })

Answer 3

使用 .filter() 并检查 object 是否有一个名为 helper 的道具。如果有多个 object 符合条件，他们的标题将作为 comma-separated 字符串连接。

片段

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');

遍历对象数组，如果值存在，return另一个值

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

javascript

reactjs