Улучшите мою функцию, чтобы уменьшить количество повторяющихся значений

#javascript #reactjs

Вопрос:

Вот мой массив:

 export const plantList = [
    {
        name: 'monstera',
        category: 'classique',
        id: '1ed'
    },
    {
        name: 'ficus lyrata',
        category: 'classique',
        id: '2ab'
    },
    {
        name: 'pothos argenté',
        category: 'classique',
        id: '3sd'
    },
    {
        name: 'yucca',
        category: 'classique',
        id: '4kk'
    },
    {
        name: 'olivier',
        category: 'extérieur',
        id: '5pl'
    },
    {
        name: 'géranium',
        category: 'extérieur',
        id: '6uo'
    },
    {
        name: 'basilique',
        category: 'extérieur',
        id: '7ie'
    },
    {
        name: 'aloe',
        category: 'plante grasse',
        id: '8fp'
    },
    {
        name: 'succulente',
        category: 'plante grasse',
        id: '9vn'
    }
]
 

И вот мой код для удаления повторяющихся значений:

 const categories = plantList.reduce(
    (acc, plant) =>
        acc.includes(plant.category) ? acc : acc.concat(plant.category),
    []
);
 

Есть ли лучший способ сделать это? Я не знаю, почему, но React не компилируется с однострочным.

 const categories = Array.from(new Set(plantList));
 

Ответ №1:

Я думаю, что лучший подход-использовать объект reduce и Map. Это однострочное решение.

 const plantList = [
    {
        name: 'monstera',
        category: 'classique',
        id: '1ed'
    },
    {
        name: 'ficus lyrata',
        category: 'classique',
        id: '2ab'
    },
    {
        name: 'pothos argenté',
        category: 'classique',
        id: '3sd'
    },
    {
        name: 'yucca',
        category: 'classique',
        id: '4kk'
    },
    {
        name: 'olivier',
        category: 'extérieur',
        id: '5pl'
    },
    {
        name: 'géranium',
        category: 'extérieur',
        id: '6uo'
    },
    {
        name: 'basilique',
        category: 'extérieur',
        id: '7ie'
    },
    {
        name: 'aloe',
        category: 'plante grasse',
        id: '8fp'
    },
    {
        name: 'succulente',
        category: 'plante grasse',
        id: '9vn'
    }
];

const uniqueData = [...plantList.reduce((map, obj) => map.set(obj.category, obj), new Map()).keys()];

console.log(uniqueData)