ReactJs: возвращать только уникальные значения из массива

Question

Эта возвращенная группа массивов возвращается как in, то есть консоль вывода регистрирует массив с именем forTypes:

 ["milk", "bread"]
 ["milk"]
 ["bread"]
 ["cheese", "jam"]

Я пытался отфильтровать его, используя

let forTypesUnique = [...new Set(forTypes)];

Я также пытался использовать другие функции, такие как Reduce(), но не повезло!

Должен ли я объединить эти отдельные массивы в один, а затем отфильтровать? Любые предложения будут оценены.

Answer 1

Вы можете использовать flat и Set :

const forTypes = [
    ["milk", "bread"],
    ["milk"],
    ["bread"],
    ["cheese", "jam"]
];
const flatForTypes = forTypes.flat()
const forTypesUnique = [...new Set(flatForTypes)];

console.log(forTypesUnique)

Надеюсь, это поможет!

Answer 2

Если все массивы поступают с сервера как вложенный массив, вы можете сделать следующее:

let arr= [
 ["milk", "bread"],
 ["milk"],
 ["bread"],
 ["cheese", "jam"]
]
let f = arr.flat()
console.log(f);// ["milk", "bread", "milk", "bread", "cheese", "jam"]
let result = [...new Set(f)]


console.log(result)// ["milk", "bread", "cheese", "jam"]

Answer 3

Перед созданием набора необходимо объединить массивы.

const typesGroup = [
    ['milk', 'bread'],
    ['milk'],
    ['bread'],
    ['cheese', 'jam'],
];

const forTypes = [].concat(...typesGroup);
const forTypesUnique = [...new Set(forTypes)];

вместо concat вы можете использовать функцию flat, но пока она находится на этапе 3 предложения

const forTypes = typesGroup.flat();

ОБНОВЛЕНО:

если у вас нет массива-обертки, то у вас, вероятно, есть какая-либо функция, которую вы вызываете для обработки элементов, поэтому вы можете использовать замыкание:

const setOfTypes = new Set();

...

const updateForTypesList = (forTypes) => {
    forTypes.map(type => setOfTypes.add(type));
    return [...setOfTypes];
}

...

const resultList = updateForTypesList(['milk', 'bread']);