首页 > 解决方案 > 使用 javascript 或 lodash 过滤具有多个元素及其值的对象数组

问题描述

我有一个对象数组,如下所示。

const data =
    [
     {id: 1, name: 'Peter',age: 21, gender: 'Male'},
     {id: 2, name: 'Steve',age: 24, gender: 'Male'},
     {id: 3, name: 'John',age: 21, gender: 'Male'},
     {id: 4, name: 'Julie',age: 26, gender: 'Female'}
    ]

我想使用 javascript 或 lodash 动态过滤具有多个元素及其值的上述数组。如果我向对象添加更多元素并尝试使用相同的过滤器,代码应该可以正常工作。我期望从如下对象传递需要过滤的元素和相应的值。

const filter = {'name':'e','gender':'mal'}

预期输出:

[{id: 1, name: 'Peter',age: 21, gender: 'Male'},
         {id: 2, name: 'Steve',age: 24, gender: 'Male'},
         {id: 4, name: 'Julie',age: 26, gender: 'Female'}]

标签: javascriptecmascript-6

解决方案


您可以通过使用条目和Array#every使用所有过滤器或Array#some仅具有对象的一个​​过滤器属性进行过滤。

const
    data = [{ id: 1, name: 'Peter', age: 21, gender: 'Male' }, { id: 2, name: 'Steve', age: 24, gender: 'Male' }, { id: 3, name: 'John', age: 21, gender: 'Male' }, { id: 4, name: 'Julie', age: 26, gender: 'Female' }],
    filter = { name: 'Pe', gender: 'Mal' },
    filters = Object.entries(filter),
    result1 = data.filter(o => filters.every(([k, v]) => o[k].includes(v))),
    result2 = data.filter(o => filters.some(([k, v]) => o[k].includes(v)));

console.log(result1);
console.log(result2);
.as-console-wrapper { max-height: 100% !important; top: 0; }


推荐阅读