如何使用過濾器設置過濾陣列？

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

如果使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) 

Answer 2

創建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 3

您可以使用Array.prototype.filter函數過濾特定對象，並使用Array.prototype.forEach函數循環過濾的數組。

我假設您不知道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; }