过滤具有多个条件和部分匹配的对象数组

Question

我发现很多过滤器用于具有多个条件的对象数组，但它们似乎完全匹配。我需要一种过滤部分匹配的方法。我似乎找到了一个或另一个。

let products = [
  { name: "A", color: "Blue", size: 50 },
  { name: "B", color: "Blue", size: 60 },
  { name: "C", color: "Black", size: 70 },
  { name: "D", color: "Green", size: 50 },
];

let filters = {
  color: "Blue",
  size: "70"
};

function multiFilter(array, filters) {
  const filterKeys = Object.keys(filters);
  return array.filter((item) => {
  return filterKeys.every(key => !!~filters[key].indexOf(item[key]));
  });

var filtered = multiFilter(products, filters);

(https://gist.github.com/jherax/f11d669ba286f21b7a2dcff69621eb72)

我正在使用此功能 - 效果很好！但比赛必须准确。如何将其更改为部分匹配？还有大写还是小写？我尝试了很多方法，但似乎无法正常工作。任何帮助将不胜感激！

Answer 1

要转换现有代码，您需要像@Vasan 指出的那样切换过滤器。

这意味着将检查products 中的属性值，以查看filters 匹配属性的值是否为子字符串。但是products 中的某些字段不是字符串。所以我们首先将它们全部转换为字符串，尽管我不确定搜索“size: 1”并获得“size: 100”项有多大用处。

    let products = [
      { name: "A", color: "Blue", size: 50 },
      { name: "B", color: "Blue", size: 60 },
      { name: "C", color: "Black", size: 70 },
      { name: "D", color: "Green", size: 50 }
    ];
    
    let filters = {
      color: "Blu",
      size: "50"
    };

    function multiFilter(array, filters) {
      const filterKeys = Object.keys(filters);
      return array.filter((item) => {
        // flipped around, and item[key] forced to a string
        return filterKeys.every(key => !!~String(item[key]).indexOf(filters[key]));
      });
    }

    var filtered = multiFilter(products, filters);
    console.log(filtered);

Answer 2

基本上你要找的是Regular Expression。你需要改变

filterKeys.every(key => !!filters[key].indexOf(item[key]))

成为

!filterKeys.some(key => RegExp(filters[key], 'i').test(item[key].toString()));

当然要小心使用item[key].toString()，因为根据具体情况，它可能会给您带来问题，在这种情况下，我使用它是因为数字（产品的尺寸键）。

let products = [{
    name: "A",
    color: "Blue",
    size: 50
  },
  {
    name: "B",
    color: "Blue",
    size: 60
  },
  {
    name: "C",
    color: "Black",
    size: 70
  },
  {
    name: "D",
    color: "Green",
    size: 50
  },
  {
    name: "D",
    color: "bluePartial", //you are looking for blue, but blue is a substring of bluepartial, this will be filtered as well
    size: 50
  },
  {
    name: "D",
    color: "violet",
    size: 700 // same as above, 70 is a substring of 700
  },
];

// the value of each key is an array with the values to filter
let filters = {
  color: "Blue",
  size: "70"
};

function multiFilter(array, filters) {
  const filterKeys = Object.keys(filters);
  return array.filter((item) => {
    return !filterKeys.some(key => RegExp(filters[key], 'i').test(item[key].toString()));
  });
}

var filtered = multiFilter(products, filters);
console.log(filtered)

Answer 3

你可以试试这样的：

let rows = [ { name: "A", color: "Blue", size: "50" }, { name: "B", color: "Blue", size: "60" }, { name: "C", color: "Black", size: "70" }, { name: "D", color: "Green", size: "50" }, ];

const filter = (a, f) => {
  let keys = Object.keys(f)
  if(keys.length == 1) {
    return a.filter(x => x[keys[0]].toLowerCase().includes(f[keys[0]].toLowerCase()))
  } else return a.filter(x => Object.values(f).every(fv => {
    return Object.values(x).some(v => v.toLowerCase().includes(fv.toLowerCase()))
  }))
}

console.log(filter(rows, {color: "Blu", size: "50"}))
console.log(filter(rows, {color: "G", size: "5"}))
console.log(filter(rows, {name: "b"}))
console.log(filter(rows, {size: "6"}))

我们的想法是，如果您只有 1 个通过字段值过滤到 filter（否则 b 将匹配 name: "B" 和 color: "Blue" 而不是 1 个结果，您将得到 3 个）但是如果您有多个过滤来自filter 对象的所有值。

代码使用String.includes 处理部分匹配，使用String.toLowerCase 处理比较值。​​