Tengo una duda sobre agrupar en Javascript.
Tengo una matriz como la siguiente, donde se garantiza que cada elemento tiene solo uno de is_sweet , is_spicy o is_bitter igual a true :
const foodsData = [{ name: 'mie aceh', is_sweet: false, is_spicy: true, is_bitter: false, }, { name: 'nasi padang', is_sweet: false, is_spicy: true, is_bitter: false, }, { name: 'serabi', is_sweet: true, is_spicy: false, is_bitter: false, }, { name: 'onde-onde', is_sweet: true, is_spicy: false, is_bitter: false, }, { name: 'pare', is_sweet: false, is_spicy: false, is_bitter: true, }];El resultado que deseo es agrupar una matriz basada en is_sweet para su primer elemento, is_bitter para su segundo elemento e is_spicy para su tercer elemento como el siguiente resultado:
[ [ { name: 'serabi', is_sweet: true, is_spicy: false, is_bitter: false }, { name: 'onde-onde', is_sweet: true, is_spicy: false, is_bitter: false } ], [ { name: 'pare', is_sweet: false, is_spicy: false, is_bitter: true } ], [ { name: 'mie aceh', is_sweet: false, is_spicy: true, is_bitter: false }, { name: 'nasi padang', is_sweet: false, is_spicy: true, is_bitter: false } ] ]He intentado hacer esto escribiendo los códigos a continuación.
const isSweet = foodsData.filter(food => food.is_sweet); const isBitter = foodsData.filter(food => food.is_bitter); const isSpicy = foodsData.filter(food => food.is_spicy); const newFood = []; newFood.push(isSweet); newFood.push(isBitter); newFood.push(isSpicy);¿Hay alguna manera de obtener el mismo resultado pero con un código más limpio usando Vanilla Javascript o Lodash?
Si bien las otras dos respuestas son correctas, personalmente considero que esta es la más legible.
Para su entrada de ejemplo:
const input = [ { name: "mie aceh", is_sweet: false, is_spicy: true, is_bitter: false, }, ... ]; Puede llamar a reducir en la matriz. Al reducir la matriz, itera sobre los elementos de una matriz, reduciendo esos valores a un acumulador ( acc ). Su acumulador puede tener cualquier valor y depende de cuál desee que sea su salida. En este caso, creo que es un objeto, asignar el nombre de sus grupos ( isSweet , isSpicy , etc.) a una matriz funciona mejor.
const { isSweet, isSpicy, isBitter } = input.reduce( (acc, item) => { if (item.is_sweet) { acc.isSweet.push(item); } else if (item.is_spicy) { acc.isSpicy.push(item); } else if (item.is_bitter) { acc.isBitter.push(item); } return acc; }, { isSweet: [], isSpicy: [], isBitter: [], } );Luego puede usar el operador de dispersión de objetos para obtener los grupos como variables.