複数の値を持つ配列をフィルタリングする

Question

JavaScript配列フィルタを使用して、いくつかのオブジェクトの配列をキーワードでフィルタリングしています。初期、私はオブジェクトの配列だった：

let works = [ 
    { title: ' work 1', medium: 'tax1' }, 
    { title: ' work 2', medium: 'tax2' }, 
    { title: ' work 3', medium: 'tax3' }, 
    { title: ' work 4', medium: 'tax2' }, 
    { title: ' work 5', medium: 'tax1' } 
    ] 

をそして、このように「中」で配列をフィルタリングすることができます：私はmediumFilterへ分類変数を渡すと（

mediumFilter(taxonomy) { 
     return works.filter(item => { 
      return (
       item.medium.indexOf(taxonomy) > -1 
      ); 
     }); 
    }, 

）、この場合は 'tax1'程度です - その特定の媒体を含むアイテムを含む配列を取得します。

これは私のプロジェクトがより複雑になった今、私は自分自身が苦労していた最初のものでした。新しい配列にはネストされた配列が含まれています。これはフィルタリングで一致する値です。

let works = [ 
    { title: ' work 1', medium: [ 'tax1', 'tax3' ] }, 
    { title: ' work 2', medium: [ 'tax1' ] }, 
    { title: ' work 3', medium: [ 'tax3' ] }, 
    { title: ' work 4', medium: [ 'tax2', 'tax1' ] }, 
    { title: ' work 5', medium: [ 'tax1' ] } 
    ] 

メディアが複数の文字列を保持する配列であることに注目してください。

私はこれにアプローチする方法についていくつかの援助を探しています。変数imと一致する項目を返す関数が必要です。いくつかの作品は複数のメディアを持つことができるため、複数の値でフィルタリングできる必要があります。媒体の配列に複数の値がある場合、一致する必要があるのは1つだけです。

ありがとうございます！

btw私は質問には関係ないvueを使用していますが、私の例の構文は正確ではないかもしれません。

Answer 1

Array#includesを使用して文字列を確認できます。

let works = [{ title: 'work 1', medium: ['tax1', 'tax3'] }, { title: 'work 2', medium: ['tax1'] }, { title: 'work 3', medium: ['tax3'] }, { title: 'work 4', medium: ['tax2', 'tax1'] }, { title: 'work 5', medium: ['tax1'] }], 
 
    mediumFilter = taxonomy => works.filter(item => item.medium.includes(taxonomy)); 
 

 
console.log(mediumFilter('tax3'));

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

Answer 2

mediumFilter(taxonomy) { 
    return works.forEach(item => { 
     for(let i = 0; i < item.medium.length; i++){ 
      if(item.medium[i].indexOf(taxonomy) > -1){ 
       return true; 
      } 
     } 
     return false; 
    }); 
}, 

私は、これはあなたが考えていたものであると信じています。分類は、配列（および常に、無mediumFilter('tax1')とmediumFilter(['tax1','tax2'])ことになるだろうであれば、あなたにもこれを行うことができます：

mediumFilter(taxonomy) { 
    return works.forEach(item => { 
     for(let i = 0; i < item.medium.length; i++){ 
      for(elem of taxonomy){ 
       if(item.medium[i].indexOf(elem) > -1){ 
        return true; 
       } 
      } 
     } 
     return false; 
    }); 
}, 

Answer 3

を私はあなたの質問を得た場合は、右、これは動作するはずです：

function mediumFilter(taxonomy) { 
    return works.filter(x => x.medium.indexOf(taxonomy) > -1); 
} 

Answer 4

あなたはオブジェクトと検索クエリの両方で配列を受け付ける機能を変更することができ

function mediumFilter(taxonomy) { 
 
    taxonomy = Array.isArray(taxonomy) ? taxonomy : [taxonomy]; 
 
    return works.filter(item => { 
 
     let medium = Array.isArray(item.medium) ? item.medium : [item.medium]; 
 
     return taxonomy.some(med => medium.includes(med)); 
 
    }); 
 
} 
 

 
let works = [ 
 
    {title: ' work 1', medium: ['tax1', 'tax2']}, 
 
    {title: ' work 2', medium: 'tax2'}, 
 
    {title: ' work 3', medium: 'tax3'}, 
 
    {title: ' work 4', medium: 'tax4'}, 
 
    {title: ' work 5', medium: 'tax5'} 
 
]; 
 

 
function log(x) {console.log(x.map(y => y.title))} 
 

 
log(mediumFilter('tax1'));   // 1 
 
log(mediumFilter(['tax1', 'tax2'])); // 1, 2 
 
log(mediumFilter('tax2'));   // 1, 2 
 
log(mediumFilter(['tax4']));   // 4

Answer 5

let works = [ 
 
    { title: ' work 1', medium: [ 'tax1', 'tax3' ] }, 
 
    { title: ' work 2', medium: [ 'tax1' ] }, 
 
    { title: ' work 3', medium: [ 'tax3' ] }, 
 
    { title: ' work 4', medium: [ 'tax2', 'tax1' ] }, 
 
    { title: ' work 5', medium: [ 'tax1' ] } 
 
] 
 

 
    function mediumFilter(taxonomy) { 
 
     return works.filter(item => { 
 
      return item.medium.filter(subitem => { 
 
       return (
 
        subitem.indexOf(taxonomy) > -1 
 
      ); 
 
      }); 
 
     }); 
 
    } 
 

 
    console.log(mediumFilter('tax1'));

Answer 6

あなたは、ネストされたループを避ける必要があります。私は、より効率的な検索に対応するために、データ構造を変更します。 {tax1:['work 1','work 2'], tax2:[],}