36

我正在玩数组试图更多地理解它们，因为我最近经常使用它们。我遇到了这种情况，我想搜索一个数组并将其元素值与另一个包含某些选定过滤器值的数组进行比较。

例如，如果我选择 3 个过滤器，我想稍后在新数组中写入匹配项 - 仅匹配所有 3 个过滤器的那些。

为了更容易理解，我在http://jsfiddle.net/easwee/x8U4v/36/上设置了一个示例

代码是：

var workItems =   [
    { "id": 2616, "category": ".category-copy .category-beauty .category-fashion"}, //this is a match
    { "id": 1505, "category": ".category-beauty"}, // NOT
    { "id": 1500, "category": ".category-beauty .category-fashion"}, // NOT
    { "id": 692, "category": ".category-stills .category-retouching"}, // NOT
    { "id": 593, "category": ".category-beauty .category-capture .category-fashion .category-product .category-stills .category-stills-retouching "}, // NOT
    { "id": 636, "category": ".category-beauty .category-copy .category-fashion"}, //this is a match
    { "id": 547, "category": ".category-fashion .category-lifestyle .category-stills .category-stills-retouching "}, // NOT
    { "id": 588, "category": ".category-capture .category-recent-work .category-copy .category-beauty .category-fashion"} //this is a match
];

var filtersArray = [".category-beauty", ".category-fashion", ".category-copy"];

var i;
for (i = 0; i < filtersArray.length; ++i) {
    var searchString = filtersArray[i];
    console.log('Searching for: ' + searchString);
    var filtered = $(workItems).filter(function(){
        return this.category.indexOf(searchString);
    });    
}   
console.log('Filtered results: ' + JSON.stringify(filtered, null, 4));

我也试过

filtered = $.grep(workItems, function(element, index){
    return element.category.indexOf(filtersArray[i]); 
}, true);

但它只匹配第一个过滤器，并且只有在它的开头workItems.category

我尝试了许多不同的解决方案，但无法真正做到这一点。我应该使用什么函数来返回所需的结果？

4

4 回答 4

25

您可以使用对象.filter()的方法Array：

var filtered = workItems.filter(function(element) {
   // Create an array using `.split()` method
   var cats = element.category.split(' ');

   // Filter the returned array based on specified filters
   // If the length of the returned filtered array is equal to
   // length of the filters array the element should be returned  
   return cats.filter(function(cat) {
       return filtersArray.indexOf(cat) > -1;
   }).length === filtersArray.length;
});

http://jsfiddle.net/6RBnB/

IE8等一些老浏览器不支持对象.filter()的方法Array，如果你使用jQuery你可以使用.filter()jQuery对象的方法。

jQuery版本：

var filtered = $(workItems).filter(function(i, element) {
   var cats = element.category.split(' ');

    return $(cats).filter(function(_, cat) {
       return $.inArray(cat, filtersArray) > -1;
    }).length === filtersArray.length;
});
于 2013-09-10T13:02:25.053 回答
18

您可以使用.filter()布尔运算符，即 &&：

     var find = my_array.filter(function(result) {
       return result.param1 === "srting1" && result.param2 === 'string2';
     });
     
     return find[0];
于 2018-06-25T11:59:50.463 回答
0

如果有人想在超过对象属性的基础上应用过滤器，这个技巧将有所帮助。

searchCustomers(){
        let tempCustomers = this.customers
        if (this.searchValue != '' && this.searchValue) {
        
        tempCustomers = tempCustomers.filter((item) => {
          

          return item.name
            .toUpperCase()
            .includes(this.searchValue.toUpperCase()) || item.customer_no
            .toUpperCase()
            .includes(this.searchValue.toUpperCase()) || item.mobno
            .toUpperCase()
            .includes(this.searchValue.toUpperCase()) 
        })
      }
      return tempCustomers;
  }
于 2021-05-21T10:41:26.300 回答
0

最好的方法是有一个值数组来搜索然后循环数据。

const ids = [1,2,3];
const products = DATA.filter((item) => ids?.includes(item.id));
于 2021-08-14T21:27:09.160 回答