javascript - 过滤多个输入字段

Question

我正在尝试使用带有 4 个输入字段的 javascript 创建一个过滤器，因此我猜测有 16 种可能的搜索组合。我可以一次搜索所有 4 个或一次搜索 1 个输入，但由于某种原因，当我添加其他语句时，我会得到奇怪的结果。有没有更好的方法来实现过滤器？

var unfilteredFloorplans = floorplanJSON.floorplanData;

filteredFloorplans = [];

for (var i = 0; i < unfilteredFloorplans.length; i++) {

    if (unfilteredFloorplans[i].city == req.body.cityName && 
        unfilteredFloorplans[i].building == req.body.buildingName && 
        unfilteredFloorplans[i].bedrooms == req.body.minBedroom && 
        unfilteredFloorplans[i].baths == req.body.maxBathroom) {

           console.log(unfilteredFloorplans[i].city);
           filteredFloorplans.push(unfilteredFloorplans[i]);
    } 
}

那么现在我需要再写 15 个 if 语句吗？我不想将它们复制进去，而是想问这是否正确，有谁知道如何使用 switch 语句来实现它？

编辑:当我说另外 15 个语句时，我的意思是如果他们只选择城市，则一个，如果他们选择城市和卧室等，则另一个。这似乎效率低下

Answer 1

一个最小的解决方法是将“and”与“or”结合起来，但请注意这如何使代码变得难以阅读:

var unfilteredFloorplans = floorplanJSON.floorplanData;

filteredFloorplans = [];

for (var i = 0; i < unfilteredFloorplans.length; i++) {

    if ((req.body.cityName == '' || unfilteredFloorplans[i].city == req.body.cityName) && 
        (req.body.buildingName == '' || unfilteredFloorplans[i].building == req.body.buildingName) && 
        (req.body.minBedroom == '' || unfilteredFloorplans[i].bedrooms == req.body.minBedroom) && 
        (req.body.maxBathroom == '' || unfilteredFloorplans[i].baths == req.body.maxBathroom)) {

           console.log(unfilteredFloorplans[i].city);
           filteredFloorplans.push(unfilteredFloorplans[i]);
    } 
}

(顺便说一句，这看起来是将连词与析取结合起来的一个很好的练习。)

编辑 我建议将过滤放入一个单独的函数中，并引入一个附加的辅助函数。另外，使用更一致的命名并使用“= =”而不是“==”。

function filterByEquality(formValue, dataValue) {
    if (formValue === '') return true;
    if (formValue === dataValue) return true;
    return false;
}

function filterFloorplan(form, data) {
    if (!filterByEquality(form.city, data.city)) return false;
    if (!filterByEquality(form.building, data.building)) return false;
    if (!filterByEquality(form.minBedrooms, data.bedrooms)) return false;
    if (!filterByEquality(form.maxBathrooms, data.bathrooms)) return false;
    return true;
}

var unfilteredFloorplans = floorplanJSON.floorplanData;
filteredFloorplans = [];
for (var i = 0; i < unfilteredFloorplans.length; i++) {
    if (filterFloorplan(req.body, unfilteredFloorplans[i]);
        console.log(unfilteredFloorplans[i].city);
        filteredFloorplans.push(unfilteredFloorplans[i]);
    } 
}

您可以通过了解 Array.filter 方法进一步减少此代码。并且您应该修复某些字段应使用“">=”或“">=”而不是“===”的错误。但我会把这些作为练习。