効率的な方法で次のコードを書くには？

Question

条件

場合、私はあなたが forEach()機能を使用することができます

applyExtraFilter() { 
     this.moreFilter = !this.moreFilter; 
     this.allItems = this.listings; 
     if (this.deliveryConcession[0].checked) { 
      this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == this.deliveryConcession[0].checked); 
     } 
     if (this.deliveryConcession[1].checked) { 
      this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == this.deliveryConcession[2].checked); 
     } 
     if (this.deliveryConcession[2].checked) { 
      this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == this.deliveryConcession[3].checked); 
     } 
     if (this.seatConcession[0].checked) { 
      this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == this.seatConcession[0].checked); 
     } 
     if (this.seatConcession[1].checked) { 
      this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == this.seatConcession[1].checked); 
     } 
     if (this.seatConcession[2].checked) { 
      this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == this.seatConcession[3].checked); 
     } 
     this.setPage(1); 
    } 

Answer 1

使用することなく、それをより効率的にするためにどのように、ラジオボタンの選択に基づいてフィルタを適用しています。

注：あなたはthis.deliveryConcessionとthis.seatConcession変数のすべての要素を反復処理するかどうそれは容易になるだろう。あなたの場合、インデックスに関するすべてのループに余分な条件を追加する必要がありました。

applyExtraFilter() { 
 
    this.moreFilter = !this.moreFilter; 
 
    this.allItems = this.listings; 
 

 
    this.deliveryConcession.forEach((v, i) => v.checked && (i == 0 || i == 2 || i == 3) ? this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == v.checked) : v); 
 

 
    this.seatConcession.forEach((v, i) => v.checked && (i == 0 || i == 1 || i == 3) ? this.allItems = this.allItems.filter(fil => fil.seatingConcession.parking == v.checked) : v); 
 

 
    this.setPage(1); 
 
}

Answer 2

これは、あなたは確かに多くの改良を行うことができ、一回のみフィルタします。

applyExtraFilter() { 
    this.moreFilter = !this.moreFilter; 
    this.allItems = this.listings; 
    this.allItems = this.allItems.filter(fil => { 
     let result = true; 
     if (this.deliveryConcession[0].checked && fil.seatingConcession.parking != this.deliveryConcession[0].checked) { 
      result = false; 
     } 
     if (this.deliveryConcession[1].checked && fil.seatingConcession.parking != this.deliveryConcession[2].checked) { 
      result = false; 
     } 
     if (this.deliveryConcession[2].checked && fil.seatingConcession.parking != this.deliveryConcession[3].checked) { 
      result = false; 
     } 
     if (this.seatConcession[0].checked && fil.seatingConcession.parking != this.seatConcession[0].checked) { 
      result = false; 
     } 
     if (this.seatConcession[1].checked && fil.seatingConcession.parking != this.seatConcession[1].checked) { 
      result = false; 
     } 
     if (this.seatConcession[2].checked && fil.seatingConcession.parking != this.seatConcession[3].checked) { 
      result = false; 
     } 

     return result; 
    }); 
    this.setPage(1); 
    } 

そのキーワードがあなたのIDEの代わりに使用varに問題を与える場合、私は、resultを宣言するためにletを使用しています。