javascript - 过滤数据数组多个值javascript

Question

我知道以前有人问过这个问题，但现有的解决方案似乎不适用于我的情况。我正在尝试根据各种对象数组中的多个属性/值过滤掉数据。

我的示例数据如下所示:

const products = [
          { name: 'A', color: 'Blue', size: 50, locations: 'USA' },
          { name: 'B', color: 'Blue', size: 60, locations: 'Europe' },
          { name: 'C', color: 'Blue', size: 30, locations: 'Europe' },
          { name: 'D', color: 'Black', size: 70, locations: 'Japan' },
          { name: 'E', color: 'Green', size: 50, locations: 'Europe' },
          { name: 'F', color: 'Blue', size: 50, locations: 'Brazil' },
          { name: 'G', color: 'Black', size: 40, locations: 'Australia' },
        ];

这就是我要求的过滤器结果:

const filters_one = ['Blue'];

const requiredResult_One = [
      { name: 'A', color: 'Blue', size: 50, locations: 'USA' }, 
      { name: 'B', color: 'Blue', size: 60, locations: 'Europe' },
      { name: 'C', color: 'Blue', size: 30, locations: 'Europe' },
      { name: 'E', color: 'Blue', size: 50, locations: 'Brazil' }, 
]


const filters_two = ['Blue', 'Europe'];

const requiredResult_Two = [
      { name: 'B', color: 'Blue', size: 60, locations: 'Europe' },
      { name: 'C', color: 'Blue', size: 30, locations: 'Europe' }, 
]


----------OR-------------------------
const filters_three = ['Black'];

const requiredResult_three = [
      { name: 'D', color: 'Black', size: 70, locations: 'Japan' },
      { name: 'G', color: 'Black', size: 40, locations: 'Australia' }, 
]

const filters_four = ['Black', 'Japan'];

const requiredResult_Four = [
      { name: 'D', color: 'Black', size: 70, locations: 'Japan' },
]

这是我迄今为止所取得的成就:

const filterdata = (products, filter) => {
      // where, filter can be equal to *filters_one*, *filters_two*, *filters_three*, 
         or *filters_four* anyone of it. //

      const keysExact = ['color', 'locations'];
      const valuesExact = filter.map(col => col.toLowerCase());

      const resultExact = products.filter((prod) =>
          keysExact.every((key) => valuesExact.includes(prod[key].toLowerCase()))
      );

      console.log(resultExact);
};

这似乎部分有效，或者对我来说似乎不是一个好方法。如果有人可以帮助我找到更好的解决方案，那将非常有帮助。

提前致谢!

Answer 1

您可以从对象中获取值并检查查询的所有值是否都在值数组中。

const
    filter = (data, query) => data.filter(o => {
        const values = Object.values(o);
        return query.every(q => values.includes(q));
    }),
    products = [{ name: 'A', color: 'Blue', size: 50, locations: 'USA' }, { name: 'B', color: 'Blue', size: 60, locations: 'Europe' }, { name: 'C', color: 'Blue', size: 30, locations: 'Europe' }, { name: 'D', color: 'Black', size: 70, locations: 'Japan' }, { name: 'E', color: 'Green', size: 50, locations: 'Europe' }, { name: 'F', color: 'Blue', size: 50, locations: 'Brazil' }, { name: 'G', color: 'Black', size: 40, locations: 'Australia' }];

console.log(filter(products, ['Blue']));
console.log(filter(products, ['Blue', 'Europe']));
console.log(filter(products, ['Black']));
console.log(filter(products, ['Black', 'Japan']));
console.log(filter(products, [['Blue', 'Green']]));

.as-console-wrapper { max-height: 100% !important; top: 0; }

同一键的替代值的一种方法。

const
    filter = (data, query) => data.filter(o => {
        const values = Object.values(o);
        return query.every(q =>
            values.includes(q) ||
            Array.isArray(q) && q.some(v => values.includes(v))
        );
    }),
    products = [{ name: 'A', color: 'Blue', size: 50, locations: 'USA' }, { name: 'B', color: 'Blue', size: 60, locations: 'Europe' }, { name: 'C', color: 'Blue', size: 30, locations: 'Europe' }, { name: 'D', color: 'Black', size: 70, locations: 'Japan' }, { name: 'E', color: 'Green', size: 50, locations: 'Europe' }, { name: 'F', color: 'Blue', size: 50, locations: 'Brazil' }, { name: 'G', color: 'Black', size: 40, locations: 'Australia' }];

console.log(filter(products, ['Blue']));
console.log(filter(products, [['Blue', 'Green']]));

.as-console-wrapper { max-height: 100% !important; top: 0; }