javascript - 如何通过多个属性过滤对象数组？

Question

对于这个问题，我自己已经得到了我想要的答案，但是我的解决方案很长并且有多个循环。

所以我在这里问是因为我想要一个替代解决方案。

我想要的是我想通过 3 个属性过滤数组。条件是如果用户填写属性函数需要搜索该属性。如果用户将属性留空，我们可以跳过过滤该属性

这是我的示例数据

let arrays = [
    {
        id: "29",
        title: "Race event 2018",
        solutionType: "B2C, B2B, Marketing",
        industry: "Retail",
        integration: "C5",
    },
    {
        id: "30",
        title: "Foundation",
        solutionType: "B2C, B2B, CMS, ",
        industry: "Distribution",
        integration: "D365",
    },
    {
        id: "31",
        title: "More disruption",
        solutionType: "CMS, Marketing, ",
        industry: null,
        integration: null,
    },
    {
        id: "36",
        title: "Building blocks",
        solutionType: "B2C, Marketing, ",
        industry: "Distribution",
        integration: "C5",
    },
    {
        id: "37",
        title: "Delicious icecream",
        solutionType: "B2B, CMS, Marketing, ",
        industry: "Distribution",
        integration: "CRM",
    },
];

这是搜索功能

我想要的是如果用户不提供要搜索的属性我想返回原始数组，如果用户不填写solutionToSearch我想搜索匹配的对象industryToSearch& integrationToSearch，

同时，如果用户不填写industryToSearch并将其留空，我想搜索对象。与solutionToSearch&integrationToSearch属性匹配，ViceVersa 用于所有 3 个值

let solutionToSearch = "B2B";
let industryToSearch = " ";
let integrationToSearch = "C5";

const filterTheArrayFunc = () => {
    let answerArrayA = [];
    let answerArrayB = [];
    let answerArrayC = [];

    for (let i = 0; i < arrays.length; i++) {
        if (solutionToSearch === "" || solutionToSearch === " ") {
            answerArrayA = arrays;
        } else {
            for (let y = 0; y < arrays[i].solutionType.split(",").length; y++) {
                if (arrays[i].solutionType.split(",")[y].trim() === solutionToSearch)
                    answerArrayA.push(arrays[i]);
            }
        }
    }

    for (let i = 0; i < answerArrayA.length; i++) {
        if (industryToSearch === "" || industryToSearch === " ") {
            answerArrayB = answerArrayA;
        } else {
            if (answerArrayA[i].industry === industryToSearch) {
                answerArrayB.push(answerArrayA[i]);
            }
        }
    }

    for (let i = 0; i < answerArrayB.length; i++) {
        if (integrationToSearch === "" || integrationToSearch === " ") {
            answerArrayC = answerArrayB;
        } else {
            if (answerArrayB[i].integration === integrationToSearch) {
                answerArrayC.push(answerArrayB[i]);
            }
        }
    }

    console.log(answerArrayC);
};

filterTheArrayFunc();

如您所见，我正在循环多次并制作了很多不必要的变量。我想改进我的代码，有人可以帮忙吗？

标签： javascriptarrays

Answer 1

查看Array.Filter ..

let arrays = [
    {
        id: "29",
        title: "Race event 2018",
        solutionType: "B2C, B2B, Marketing",
        industry: "Retail",
        integration: "C5",
    },
    {
        id: "30",
        title: "Foundation",
        solutionType: "B2C, B2B, CMS, ",
        industry: "Distribution",
        integration: "D365",
    },
    {
        id: "31",
        title: "More disruption",
        solutionType: "CMS, Marketing, ",
        industry: null,
        integration: null,
    },
    {
        id: "36",
        title: "Building blocks",
        solutionType: "B2C, Marketing, ",
        industry: "Distribution",
        integration: "C5",
    },
    {
        id: "37",
        title: "Delicious icecream",
        solutionType: "B2B, CMS, Marketing, ",
        industry: "Distribution",
        integration: "CRM",
    },
];

let solutionToSearch = " ";
let industryToSearch = " ";
let integrationToSearch = "C5";

const filterTheArrayFunc = () => {
    return arrays.filter(obj=>
      (!solutionToSearch.trim() || (obj.solutionType || "").includes(solutionToSearch.trim())) &&
      (!industryToSearch.trim() || (obj.industry || "").includes(industryToSearch.trim())) &&
      (!integrationToSearch.trim() || (obj.integration || "").includes(integrationToSearch.trim()))
    );
};

var filtered = filterTheArrayFunc();
console.log(filtered);

您可以通过传递参数而不是依赖外部范围的变量来进一步改进这一点。此外，您可以按属性名称进行过滤，而不是创建一个新变量来为每个属性名称定义搜索参数。

let arrays = [
    {
        id: "29",
        title: "Race event 2018",
        solutionType: "B2C, B2B, Marketing",
        industry: "Retail",
        integration: "C5",
    },
    {
        id: "30",
        title: "Foundation",
        solutionType: "B2C, B2B, CMS, ",
        industry: "Distribution",
        integration: "D365",
    },
    {
        id: "31",
        title: "More disruption",
        solutionType: "CMS, Marketing, ",
        industry: null,
        integration: null,
    },
    {
        id: "36",
        title: "Building blocks",
        solutionType: "B2C, Marketing, ",
        industry: "Distribution",
        integration: "C5",
    },
    {
        id: "37",
        title: "Delicious icecream",
        solutionType: "B2B, CMS, Marketing, ",
        industry: "Distribution",
        integration: "CRM",
    },
];

function filterTheArrayFunc(arr, params){
    var filter_keys = Object.keys(params);
    return arrays.filter(obj=>{
      return filter_keys.reduce((match, key) => {
        let value = params[key].trim();
        if(!match) return false;
        if(!obj[key] || !obj[key].includes(value)) return false;
        return match;
      }, true);
    });
};

var filtered = filterTheArrayFunc(arrays, {
  solutionType: "B2B",
  integration: "C5"
});

console.log(filtered);