Как добавить элементы из нескольких массивов в другой массив?

Question

У меня есть массив объектов, с которыми я зацикливаюсь Vue. Каждый объект имеет пару ключ-значение, причем значение является другим массивом. Как я могу l oop над каждым объектом, а затем l oop над каждым массивом в этом объекте, чтобы добавить все уникальные элементы в один массив?

 const objects: [
   {
      hungry: true,
      name: "pete",
      fruits: ["banana", "orange"]
   },
   {
      hungry: false,
      name: "sam",
      fruits: ["grapes", "kiwi"]
   },
   {
      hungry: true,
      name: "george",
      fruits: ["pear", "mango"]
   }
 ]

Это сближает меня, но просто добавляет каждый внутренний массив во внешний массив, а не уникальные элементы в этом массиве ...

      uniqueFruits: function() {
            const fruitList = [];
            this.objects.forEach((object)=>{
                if (!fruitList.includes(object.fruits)) {
                    fruitList.push(objects.fruits);
                }
            });
            return fruitList;
        }

Я знаю, что мне нужно как-то снова l oop внутри, чтобы получить элементы во внутреннем массиве. Любая помощь?

Answer 1

Я думаю, вы ищете что-то вроде этого:

const objects = [
   {
      hungry: true,
      name: "pete",
      fruits: ["banana", "orange"]
   },
   {
      hungry: false,
      name: "sam",
      fruits: ["grapes", "kiwi"]
   },
   {
      hungry: true,
      name: "george",
      fruits: ["pear", "mango"]
   }
 ];
 
const fruitList = [];

objects.forEach(item => item.fruits.forEach(fruit => fruitList.push(fruit)));

console.log(fruitList);

---

Обновление:

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

    const objects = [
       {
          hungry: true,
          name: "pete",
          fruits: ["banana", "orange"]
       },
       {
          hungry: false,
          name: "sam",
          fruits: ["grapes", "banana"]
       },
       {
          hungry: true,
          name: "george",
          fruits: ["orange", "mango"]
       }
     ];
     
    const fruitList = [];

    objects.forEach(item => item.fruits.forEach(fruit => {
        if (fruitList.indexOf(fruit) < 0) {
            fruitList.push(fruit);
        }
    }));

    console.log(fruitList);

Answer 2

Использование вложенного l oop - это один из способов, с es6 вы можете вместо fruitList.push(objects.fruits); сделать: fruitList = [...fruitList, ...objects.fruits];

Один из способов удаления дубликатов состоит в том, что после получения всего fruitList, преобразовать его в набор по const fruitSet = new Set(fruitList);. Это оставит вам только уникальные фруктовые названия. Если вам нужен тип массива, просто const fruitArray = Array.from(fruitSet);.