如何使数组过滤器返回结果而不是javascript中的或

目前，我的代码根据用户选择的复选框显示图像。数组处理[i]显示他们检查的所有内容（这个或这个或这个）。它以自身为基础。我想要的是一个良好的环境。当前，如果用户单击百叶窗、浴室、当代，结果将显示所有带有百叶窗的图像、所有浴室图像和所有当代图像。我只想展示带有百叶窗的现代浴室的图片

以下是当前代码：

function showFilteredImages() {

     var productChoice = [...new Set(productSelect)];
     var roomChoice = [...new Set(roomSelect)];
     var styleChoice = [...new Set(styleSelect)];

        $(".treatment").each(function() {
            $(this).removeClass('filtered');
        });


        for (var i=0; i<treatments.length; i++){
            for (var j=0; j<productChoice.length; j++){
                if (treatments[i].product.indexOf(productChoice[j]) !== -1){
                    treatments[i].$elem.addClass('filtered');
                    break;
                }
            }

            for (var j=0; j<roomChoice.length; j++){
                if (treatments[i].room.indexOf(roomChoice[j]) !== -1){
                    treatments[i].$elem.addClass('filtered');
                    break;
                }         
            }

            for (var j=0; j<styleChoice.length; j++){
                if (treatments[i].style.indexOf(styleChoice[j]) !== -1){
                    treatments[i].$elem.addClass('filtered');
                    break;
                }         
            }
       
        $('.treatment').each(function(index, el){
                if(!$(el).hasClass('filtered')){

                    $(el).hide();
                }   
                else{
                    $(el).show();
                }        
            }); 
    }     

函数showFilteredImages（）{
var productChoice=[…新集合（productSelect）]；
var roomChoice=[…新设置（roomSelect）]；
var styleChoice=[…新集合（styleSelect）]；
$（“.treatment”）。每个（函数（）{
$（this.removeClass（'filtered'）；
});
对于（var i=0；i你可以试试这个

函数showFilteredImages（）{
让productChoice=[…新集合（productSelect）]；
let roomChoice=[…新设置（roomSelect）]；
让styleChoice=[…新集合（styleSelect）]；
$（.treatment”）.each（（）=>$（this.removeClass（“filtered”）；
let choices=[productChoice，roomChoice，styleChoice]；
//“loop1”是循环的名称，我们需要命名它，这样我们就可以跳过其中嵌套循环的迭代；
循环1：
for（设i=0；i

解释

首先，我将选项组分组在一个数组中
choices
，以便于循环
我们不检查元素（处理）是否在选择范围内，而是检查它是否在选择范围内，如果它没有我们想要的标准之一，则跳过它
在选择循环之后，我们将类
filtered
添加到通过所有标准的
treatment
如果
treatments
是元素列表，那么您的代码应该只迭代
treatments
一次，并检查每个集合是否存在。您还可以在该迭代中显示/隐藏

大多数数据都缺乏定义，但我将假设每个
集合
都包含有问题的数据，因此我们不需要将其转换为数组

function showFilteredImages() {

    // Let's use these sets
    var productChoice = new Set(productSelect);
    var roomChoice = new Set(roomSelect);
    var styleChoice = new Set(styleSelect);

    // Remove the "filtered" class and hide them all
    $(".treatment").removeClass("filtered").hide();

    // Filter down to the ones meeting the AND condition,
    //   and then add the "filtered" class and show them
    treatments
      .filter(t => 
        t.product.some(item => productChoice.has(item)) &&
        t.room.some(item => roomChoice.has(item))       &&
        t.style.some(item => styleChoice.has(item))
      )
      .forEach(t => t.$elem.addClass("filtered").show())
}

如果“filtered”类的唯一目的是标记它们，以便重新选择它们，那么就不再需要它了，因为我们正在立即完成所有工作


编辑：我删除了helper函数，因为它实际上并没有使事情变得更短或更清晰。
你能给我们一段HTML，这样我们就有了一个可复制的基础。我们不需要任何HTML，但我们需要知道
集合
对象引用了什么，以及
处理
数组（因为你在每个人身上都做了
$elem
）…看起来你确实可以在
治疗的一次迭代中做任何事情，
…你为什么要这样做：
[…新设置（roomSelect）]
。你正在拿一些东西，把它做成一个
集合
，然后把这个集合变成一个数组。你能告诉我
治疗
数组里面是什么，以及用户的选择是如何保存在里面的吗？比我刚才做的要简单一点。谢谢。让我试一试，它让我选择百叶窗和鞋子的复选框wed所有的图像都是百叶窗，但仅此而已。无法选中房间或样式的任何复选框这些复选框是使用数据库中的数据动态创建的：产品、房间、样式。然后我将它们传递给ShowFilterDimages并进行[…新设置]这会删除所有重复的产品、房间、样式，并将它们放入一个新的阵列中。我看你在说什么。是的，每一套都包含所有有问题的数据。例如：productChoice有百叶窗、窗帘、窗帘、百叶窗、帷幔。roomChoice有浴室、卧室、厨房、起居室等等。这是关于套装的好东西。你可以做一个Constantt时间查找，而不是在列表上进行完整的迭代。使事情变得更短。太好了！！我本来打算删除它的。
function showFilteredImages() {

    // Let's use these sets
    var productChoice = new Set(productSelect);
    var roomChoice = new Set(roomSelect);
    var styleChoice = new Set(styleSelect);

    // Remove the "filtered" class and hide them all
    $(".treatment").removeClass("filtered").hide();

    // Filter down to the ones meeting the AND condition,
    //   and then add the "filtered" class and show them
    treatments
      .filter(t => 
        t.product.some(item => productChoice.has(item)) &&
        t.room.some(item => roomChoice.has(item))       &&
        t.style.some(item => styleChoice.has(item))
      )
      .forEach(t => t.$elem.addClass("filtered").show())
}