Блог

если я хочу, например, выполнить цикл по этому массиву, чтобы найти определенный элемент в массиве Items, как к этому подойти? я создал эту логику, но она не работает

 DATA.map((D)=>{
    return D.items.find((item)=>{
       return item.name ==='Blue Beanie'
    })
  })
  

это массив плюс способ создания нового массива, который включает в себя оба массива элементов, которые должны быть такими: элементы: [{
идентификатор: 1,
имя: ‘Brown Brim’,
цена: 25
},
{
идентификатор: 2,
имя: ‘Blue Beanie’,
цена: 18
},
{
идентификатор: 3,
имя: ‘Adidas NMD’,
цена: 220
},
{
идентификатор: 4,
имя: ‘Adidas Yeezy’,
цена: 280
}
]

 const DATA= [
  {
    id: 1,
    title: 'Hats',
    routeName: 'hats',
    items: [
      {
        id: 1,
        name: 'Brown Brim',
        price: 25
      },
      {
        id: 2,
        name: 'Blue Beanie',
        price: 18
      }
    ]
  },
  {
    id: 2,
    title: 'Sneakers',
    routeName: 'sneakers',
    items: [
      {
        id: 3,
        name: 'Adidas NMD',
        price: 220
      },
      {
        id: 4,
        name: 'Adidas Yeezy',
        price: 280
      }
             ]
  }
];
  

Преобразовать DATA в список элементов и найти из этого списка ожидаемый элемент

 const res = DATA.flatMap((D) => D.items).find(
  (item) => item.name === "Brown Brim"
)
  

 const DATA = [
  {
    id: 1,
    title: "Hats",
    routeName: "hats",
    items: [
      {
        id: 1,
        name: "Brown Brim",
        price: 25,
      },
      {
        id: 2,
        name: "Blue Beanie",
        price: 18,
      },
    ],
  },
  {
    id: 2,
    title: "Sneakers",
    routeName: "sneakers",
    items: [
      {
        id: 3,
        name: "Adidas NMD",
        price: 220,
      },
      {
        id: 4,
        name: "Adidas Yeezy",
        price: 280,
      },
    ],
  },
]

const res = DATA.flatMap((D) => D.items).find(
  (item) => item.name === "Brown Brim"
)

console.log(res)  

Ссылка

Array.prototype.flatMap()

Может быть, это полезно?

 const DATA= [
  {id: 1,title:'Hats',routeName:'hats',
   items:[{id: 1,name:"Brown Brim",price:25},
          {id: 2,name: 'Blue Beanie',price: 18}]},
  {id: 2,title: 'Sneakers',routeName: 'sneakers',
   items: [{id: 3,name: 'Adidas NMD',price: 220},
           {id: 4,name: 'Adidas Yeezy',price: 280}]}
];
console.log(DATA.map(D=>D.items.find(item=>item.name==='Brown Brim'))
                .filter(e=>e))  

.map Возвращает либо элемент, соответствующий вашему критерию, либо undefined , затем цепочка .filter удаляет все «ложные» элементы, т. е. все undefined единицы.

Что касается первого вопроса «выполните цикл по этому массиву, чтобы найти определенный элемент в массиве элементов», учитывая, что он никак не отсортирован, это можно сделать, выполнив итерацию по массиву ДАННЫХ и выполнив поиск внутри элементов, если хотите получить доступ к элементу извне области ‘forEach’, вы должны объявить переменную снаружи

Что касается второго вопроса, используйте функцию reduce при повторении массива

ПРИМЕЧАНИЕ: Очевидно, что вы можете объединить обе задачи, поскольку вы уже выполняете итерацию по массиву, поэтому нет необходимости делать это дважды. Но чтобы избежать путаницы, я разделил логику. Кроме того, если вы решите объединить задачи, использование reduce не имеет значения, но очень похоже на ответ на первый вопрос, вы можете объявить буфер, такой как массив, и просто копировать в него элементы на ходу (я оставлю вопросы о производительности, если на то пошло)

 const DATA = [
  {
    id: 1, title: 'Hats', routeName: 'hats',
    items: [
      {id: 1,name: 'Brown Brim',price: 25},
      {id: 2,name: 'Blue Beanie',price: 18}
    ]
  },
  {
    id: 2, title: 'Sneakers', routeName: 'sneakers',
    items: [
      {id: 3,name: 'Adidas NMD',price: 220},
      {id: 4,name: 'Adidas Yeezy',price: 280}
    ]
  }
];

//Question 1
//creating the object that will hold the item
//outside of the 'forEach' scope so we can use it later
let res = {};
const searchRes = DATA.forEach(entry => {
  entry.items.forEach(item => {
    if (item.name === 'Brown Brim')
      //duplicating the item to a variable declared outside of this scope
      res = { ...item
      };
  });
});
console.log(`Q1 - The item we found:`);
console.log(res);

// Question 2
// Merging all object inside the 'items' array using Reduce
const merged = DATA.reduce((acc, curr) =>
  acc.concat(curr.items), []);
console.log(`Q2 - The merged array:`);
console.log(merged)