tuukan.js

---

const lajiteltuObjekti = food.reduce((foodList, currentItem) => {
  if (currentItem.main === 'Pääruoka') {
    foodList.mains.push(currentItem);
  } else if (currentItem.main === 'Alkuruoka') {
    foodList.starters.push(currentItem);
  }
  return foodList;
}, {mains: [], starters: []})

console.log(lajiteltuObjekti)

---

const lajiteltuObjekti = food.reduce((foodList, currentItem) => {
  if (currentItem.main === 'Pääruoka') {
    foodList.mains.courses.push(currentItem);
  } else if (currentItem.main === 'Alkuruoka') {
    foodList.starters.courses.push(currentItem);
  }
  return foodList;
}, {mains: {title: 'Pääruoka', courses: []}, starters: {title: 'Jälkiruoka', courses: []}})

---

array.reduce((previousValue, currentItem) => {


// ekalla kierroksella accumulator on tässä tapauksessa {} tyhjä objekti

// ekalla kierroksella currentItem on tässä tapauksessa arrayn ensimmäinen value


// hyötynä on se että voit tuupata previousValue objektiin arrayn sisältöä miten haluat
 
return previousValue



}, {})

---

const uusiHaluttuTietoRakenne = {}; 
array.reduce((uusiHaluttuTietoRakenne, current) => {

...logiikkaa...

return uusiHaluttuTietoRakenne
}, uusiHaluttuTietoRakenne)

---

const courseTypes = {
  MAIN: 'Pääruoka',
  STARTER: 'Alkuruoka',
  DESSERT: 'Jälkiruoka'
}

const initialMenuData = {
  mains: {title: courseTypes.MAIN, courses: []}, 
  starters: {title: courseTypes.STARTERS, courses: []}
}

const lajiteltuObjekti = food.reduce((foodList, currentItem) => {
  const { courseType } = currentItem;
  const { mains, starters } = foodList;
  
  if (courseType === courseTypes.MAIN) 
    mains.courses = [...mains.courses, currentItem];
  else if (courseType === courseTypes.STARTER)
    starters.courses = [...starters.courses, currentItem];
  
  return foodList;
}, initialMenuData)

Tuukka opettaa! 👍🏻

https://codesandbox.io/s/triple-v-for-loop-s5tm0?file=/src/App.vue:1688-1694