Tengo una variedad de artículos disponibles:
const items = [{id: 1, title: Item 1}, {id: 2, title: Item 2}, {id: 3, title: Item 3}]
y una serie de artículos que mi usuario ha comprado:
const purchasedItems = [{id: 1, title: Item 1}, {id: 2, title: Item 2}]
Quiero mostrar una variedad de artículos que aún están disponibles para comprar y que aún no han comprado, es decir, solo el artículo 3 en este caso. Así que quiero que se devuelva una matriz con solo el elemento 3.
Yo he tratado:
const availableItems = items.filter( (item) => !purchasedItems.includes(item) )Sin embargo, esto solo devuelve una lista de todos los elementos nuevamente.
Creo que debo estar perdiendo algo bastante obvio, ¡cualquier ayuda se agradece!
includes no funcionará aquí porque solo comparará los elementos con una igualdad estricta (como en item1 === item2 ). Solo funcionará si sus artículos son los mismos objetos con la misma referencia.
Un pequeño ejemplo:
const obj1 = { test: 1 }; const obj2 = obj1; const obj3 = { test: 1 }; console.log(obj1 === obj2); // true console.log(obj1 === obj3); // falseEntonces, en su caso, debe hacer un trabajo más complejo en su función de filtro:
const availableItems = items.filter(item1 => !purchasedItems.some(item2 => item1.id === item2.id));Use findIndex() en lugar de include
const items = [{ id: 1, title: 'Item 1' }, { id: 2, title: 'Item 2' }, { id: 3, title: 'Item 3' }] const purchasedItems = [{ id: 1, title: 'Item 1' }, { id: 2, title: 'Item 2' }] const availableItems = items.filter((item) => (purchasedItems.findIndex(purchasedItem => purchasedItem.id === item.id) == -1)) console.log(availableItems)