Estoy tratando de evitar importar lodash para un filtro simple. Estoy tratando de hacer algo similar a esto...
// Items [ { "title": "a", "name": "a", "location": "here"}, { "title": "b", "name": "a", "location": "here"}, { "title": "d", "location": "there"}, ] // Filter { "name" : "a", "location": "here" } Debería devolver los dos primeros artículos. En lodash esto se hace con algo similar a _.filter(Items, Filter) . Me gustaría implementar esto sin lodash o un montón de código y obtener Object.keys . ¿Hay una manera simple en Javascript moderno para manejar esto?
Esto es lo que se me ocurrió, parece funcionar bien
let foo = [ { "title": "a", "name": "a", "location": "here"}, { "title": "b", "name": "a", "location": "here"}, { "title": "d", "location": "there"}, ]; let bar = { "name" : "a", "location": "here" }; let result = foo.filter(obj => Object.entries(bar).every(([k,v]) => obj[k]===v) ); console.log(result);No creo que haya una "manera simple en Javascript moderno para manejar esto", pero si no tiene un requisito estricto para evitar Object.keys , puede escribir una función de ayuda para hacer esto:
const myItems = [ { "title": "a", "name": "a", "location": "here"}, { "title": "b", "name": "a", "location": "here"}, { "title": "d", "location": "there"}, ] const myFilter = { "name" : "a", "location": "here" }; const filter = (items, filterBy) => items.filter(item => Object.keys(filterBy).every(key => item[key] === filterBy[key]) ) alert(JSON.stringify(filter(myItems, myFilter)));Puede obtener las entradas del filtro por adelantado para evitar obtener las entradas para cada iteración de filtrado.
const filter = (array, filter) => { const filterBy = entries => o => entries.every(([k, v]) => o[k] === v); return items.filter(filterBy(Object.entries(filters))); }, items = [{ title: "a", name: "a", location: "here" }, { title: "b", name: "a", location: "here" }, { title: "d", location: "there"}], filters = { name: "a", location: "here" }, result = filter(items, filters); console.log(result); .as-console-wrapper { max-height: 100% !important; top: 0; }