将过滤器选项传递给Javascript过滤器方法

时间:2015-08-11 01:06:57

标签: javascript

假设用户想要根据设置以下布尔值来查看音乐家列表:

english_filter = true; // ("EN")
spanish_filter = false; // ("ES")
underground_filter = true; // ("underground")
famous_filter = true; // ("famous")

在上面的例子中,用户选择看到说英语并且是着名的或地下的音乐家。

基于这些设置,我想过滤一个名为customArray的数组。

function applyFilters(el) {
   return el.language === "EN" &&  (el.popularity === 'famous' || el.popularity === 'underground');
}

var filtered = customArray.filter(applyFilters);

这是" el"的一个例子。传递给applyFilters的结构:

{
id: "sHYNYKFENX"
language: "EN"
name: "John Smith"
popularity: "famous"
profile_image:"https://google.com/fakeimage.jpeg"
recording_handle: "DvYenMhJ8Mo"
recording_title: "Awesome song"
}

上面的代码有效,但我想抽象它,以便用户可以选择他想要的任何组合。我怎么能创建一个功能来实现这一目标?

非常感谢

更新:

感谢您的所有答案 - 我认为我们很接近。以下是一些预期结果:

var english_filter = false; // ("EN")
var spanish_filter = false; // ("ES")
var underground_filter = false; // ("underground")
var famous_filter = false; // ("famous")

应列出所有音乐家。

var english_filter = false; // ("EN")
var spanish_filter = false; // ("ES")
var underground_filter = true; // ("underground")
var famous_filter = false; // ("famous")

只有地下音乐家,无论他们说什么语言。

如果可能的话,制作一个允许你通过它的语言的解决方案是很棒的,而不仅仅是英语和西班牙语。 (虽然不是必需的)。谢谢大家!谢谢。你们都很棒。

3 个答案:

答案 0 :(得分:1)

我猜你想要使用动态过滤器,例如:

var filters = { language: "EN" };

// or
var filters = { language: "EN", popularity: "famous" };

// or using an array to indicate more than one option
var filters = {
    language: [
        "EN",
        "ES"
    ],
    popularity: "famous"
};

因此,您必须编写一个函数来读取选项并与每个对象属性进行比较:

function applyFilters(elem, filters) {
    var value, name, objectHasThisProperty, propertyHasValue;
    for(name in filters) {
        value = filters[name];

        objectHasThisProperty = elem.hasOwnProperty(name);
        propertyHasValue = isArray(value) ? inArray(elem[name], value) : elem[name] == value;

        if (!objectHasThisProperty || !propertyHasValue) {
            return false;
        }
    }
    return true;
}

然后你会这样称呼它:

var filtered = customArray.filter(function(elem) {
    return applyFilters(elem, filters)
});

另外还有两个辅助函数:

function isArray(variable) {
    return Object.prototype.toString.call(variable) === '[object Array]';
}
function inArray(needle, haystack) {
    return haystack.indexOf(needle) !== -1;
}

查看实际操作:JSFiddle

答案 1 :(得分:0)

Howabout

var filters = {
  english: { prop:"language", val:"EN", enabled: true},
  spanish: { prop:"language", val:"ES", enabled: false},
  underground: { prop:"popularity", val:"underground", enabled: true},
  famous: { prop:"popularity", val:"famous", enabled: false}
};

function applyFilters(el) {
   for (var i in filters) {
     var f = filters[i];
     if (filters.hasOwnProperty(f) && f.enabled && el[f.prop] !== f.val) return false;
   }
   return true;
}

var filtered = customArray.filter(applyFilters);

您可以将它们设置为

filters.spanish.enabled = true;

答案 2 :(得分:0)

如果我理解正确的话,

sharedInstance