Как отфильтровать массив с настройками фильтра?

Question

Я застрял с массивом, объектами и фильтрами.У меня есть следующий код, и я хочу отфильтровать список (массив) с моими настройками фильтра.а затем сделать что-то с этим.Я использую React как фреймворк.Но я думаю, что это чистый Javascript.

Я в правильном направлении?

filterSettings = { flagA: false, flagB: true, FlagC: true};
        list = [
            {flag: a, txt: 'some text1'},
            {flag: a, txt: 'some text2'},
            {flag: b, txt: 'some text3'},
            {flag: b, txt: 'some text4'},
            {flag: c, txt: 'some text5'},
            {flag: c, txt: 'some text6'},
        ] 

        list.filter(
            // if(filtersettings.a === true) show flags with a 
            //else{hide flags with a}
            // if(filtersettings.b === true) show flags with b 
            //else{hide flags with b}
            ///...ect
        ).map((item)=>{
            console.log(item);
        });

Answer 1

Создайте 3 переменные a, b, c для обработки трех случаев, затем используйте filter ()

var a,b,c;
var new_list = list.filter((item)=>{
    if(filterSettings.flagA==true && item.flag=="a")
    {
         return a.push(item);
    }
    else if(filterSettings.flagB==true && item.flag="b")
    {
         return b.push(item);
    }
   else(filterSettings.flagC==true && item.flag=="c")
   {
         return c.push(item);
   }
}

Чтобы получить окончательный результат, используйте свойство .length, чтобы проверить, какая из них больше 0

if (a.length>0){
    console.log(a)
}
else if (b.length>0){
    console.log(a)
}
else(c.length>0){
    console.log(a)
}

Answer 2

Вы можете использовать функцию Array.prototype.filter для фильтрации определенных объектов и функцию Array.prototype.forEach для зацикливания отфильтрованного массива.

IЯ предполагаю, что вы не знаете функцию Array.prototype.map и ее назначение, потому что используемый способ вернет массив с неопределенными значениями

const filterSettings = { a: false, b: true, c: true},
      list = [    {flag: 'a', txt: 'some text1'},    {flag: 'a', txt: 'some text2'},    {flag: 'b', txt: 'some text3'},    {flag: 'b', txt: 'some text4'},    {flag: 'c', txt: 'some text5'},    {flag: 'c', txt: 'some text6'}],
      handler = ({flag}) => filterSettings[flag];

list.filter(handler).forEach(item=> console.log(item))

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Если вы сделаете клавиши filterSettings соответствующими значениям флага, вы можете просто использовать значение filterSettings (которое является логическим значением) в качестве теста для фильтра:

let filterSettings = { a: false, b: true, c: true};
let list = [
    {flag: 'a', txt: 'some text1'},
    {flag: 'a', txt: 'some text2'},
    {flag: 'b', txt: 'some text3'},
    {flag: 'b', txt: 'some text4'},
    {flag: 'c', txt: 'some text5'},
    {flag: 'c', txt: 'some text6'},
] 

let filtered = list.filter( item => filterSettings[item.flag]) // filterSettings[item.flag] will be a boolean
console.log(filtered)