根據另一個數組 Object 作為條件過濾對象數組

Question

我有這個對象數組

const data = [
    { id: 0, ALT_VALUE: 11, DLT_VALUE: 76 },
    { id: 1, ALT_VALUE: 80, DLT_VALUE: 48 },
    { id: 2, ALT_VALUE: 90, DLT_VALUE: 100 },
    { id: 3, ALT_VALUE: 12, DLT_VALUE: 70 },
    { id: 4, ALT_VALUE: 90, DLT_VALUE: 100 },
    { id: 5, ALT_VALUE: 13, DLT_VALUE: 49 },
    { id: 6, ALT_VALUE: 76, DLT_VALUE: 70 },
    { id: 7, ALT_VALUE: 9, DLT_VALUE: 15 },
];

我想根據這個對象數組動態過濾它

const filters = [
    { parameter: "ALT_VALUE", min: 8, max: 100 },
    { parameter: "DLT_VALUE", min: 30, max: 50 },
];

基於過濾器，最終結果應該是

[
  { id: 5, ALT_VALUE: 13, DLT_VALUE: 49 },
  { id: 1, ALT_VALUE: 80, DLT_VALUE: 48 },
]

我試過這個

const result = data.filter((el) => {
    return filters.filter((f) => {
        if (el[f.parameter] > f.min && el[f.parameter] < f.max) {
            return el;
        }
    });
});

但我得到了所有的數據

[
  { id: 0, ALT_VALUE: 11, DLT_VALUE: 76 },
  { id: 1, ALT_VALUE: 80, DLT_VALUE: 48 },
  { id: 2, ALT_VALUE: 90, DLT_VALUE: 100 },
  { id: 3, ALT_VALUE: 12, DLT_VALUE: 70 },
  { id: 4, ALT_VALUE: 90, DLT_VALUE: 100 },
  { id: 5, ALT_VALUE: 13, DLT_VALUE: 49 },
  { id: 6, ALT_VALUE: 76, DLT_VALUE: 70 },
  { id: 7, ALT_VALUE: 9, DLT_VALUE: 15 }
]

Answer 1

由於您希望所有過濾器都得到尊重，因此您需要使用每個過濾器而不是過濾器。

如果您使用過濾器，如果任何過濾器規則匹配，它將導致將其添加到最終 output。

 const data = [ { id: 0, ALT_VALUE: 11, DLT_VALUE: 76 }, { id: 1, ALT_VALUE: 80, DLT_VALUE: 48 }, { id: 2, ALT_VALUE: 90, DLT_VALUE: 100 }, { id: 3, ALT_VALUE: 12, DLT_VALUE: 70 }, { id: 4, ALT_VALUE: 90, DLT_VALUE: 100 }, { id: 5, ALT_VALUE: 13, DLT_VALUE: 49 }, { id: 6, ALT_VALUE: 76, DLT_VALUE: 70 }, { id: 7, ALT_VALUE: 9, DLT_VALUE: 15 }, ]; const filters = [ { parameter: "ALT_VALUE", min: 8, max: 100 }, { parameter: "DLT_VALUE", min: 30, max: 50 }, ]; const result = data.filter((el) => { return filters.every((f) => { if (el[f.parameter] > f.min && el[f.parameter] < f.max) { return el; } }); }) console.log(result)

Answer 2

在您的 function 中， filters.filter filters.filter()返回一個Array ， JavaScript 將其視為真值。 這意味着data中的每個項目都通過了您的過濾器（每次迭代都會產生一個數組，無論是否為空，都被解釋為true ），並且包含所有內容。

通過讓filter返回 Boolean 值，您可以避免 JavaScript 將數組強制轉換為 Boolean 值：

const result = data.filter((el) => {
    // every will only return true if all filters match,
    // else it will return false
    return filters.every((f) => {
        if (el[f.parameter] > f.min && el[f.parameter] < f.max) {
            return el;
        }
    });
});

Answer 3

請使用every而不是第二個filter

如果數組中的每個元素都與回調中的條件匹配， Array.prototype.every將返回 true

 const data = [ { id: 0, ALT_VALUE: 11, DLT_VALUE: 76 }, { id: 1, ALT_VALUE: 80, DLT_VALUE: 48 }, { id: 2, ALT_VALUE: 90, DLT_VALUE: 100 }, { id: 3, ALT_VALUE: 12, DLT_VALUE: 70 }, { id: 4, ALT_VALUE: 90, DLT_VALUE: 100 }, { id: 5, ALT_VALUE: 13, DLT_VALUE: 49 }, { id: 6, ALT_VALUE: 76, DLT_VALUE: 70 }, { id: 7, ALT_VALUE: 9, DLT_VALUE: 15 }, ]; const filters = [ { parameter: "ALT_VALUE", min: 8, max: 100 }, { parameter: "DLT_VALUE", min: 30, max: 50 }, ]; const result = data.filter((el) => { return filters.every((f) => { if (el[f.parameter] > f.min && el[f.parameter] < f.max) { return el; } }); }); console.log(result)