Фильтровать объекты с помощью фильтра

Question

У меня есть массив объектов, как показано ниже:

pages= [
   {
      "id":1,
      "name":"name1",
      "languages":[
         {
            "id":1,
            "lang":"en"
         },
         {
            "id":2,
            "lang":"de"
         }
      ]
   },
   {
      "id":2,
      "name":"name2",
      "languages":[
         {
            "id":1,
            "lang":"en"
         },
         {
            "id":2,
            "lang":"de"
         }
      ]
   },
   {
      "id":3,
      "name":"name3",
      "languages":[
         {
            "id":1,
            "lang":"en"
         }
      ]
   }
]

И массив языков (они будут установлены нажатием на флажки), как показано ниже:

selectedLanguages=['en'];

Теперь я хочу отфильтровать основной массив в зависимости от значений selectedLanguages. Я пробовал с кодом ниже:

pages.filter(page => {
    var present = false;
    page.languages.map(l => {
        if(selectedLanguages.includes(l.lang)) {
            present = true;
        }
    });
    if(present) {
        return page;
    }
})

Желаемый результат: если selectedLanguages = ['en'], то все элементы из pages, если de, то первые 2 элемента.

Это работает, но мне любопытно, смогу ли я сделать это лучше?

Любые предложения будут полезны :) Спасибо.

Answer 1

Вместо того, чтобы пытаться создать промежуточный массив с .map, было бы лучше просто проверить, включает ли some из languages значение lang, совпадающее с selectedLanguages:

const pages=[{"id":1,"name":"name1","languages":[{"id":1,"lang":"en"},{"id":2,"lang":"de"}]},{"id":2,"name":"name2","languages":[{"id":1,"lang":"en"},{"id":2,"lang":"de"}]}]
const selectedLanguages=['en'];
console.log(
  pages.filter(({ languages }) => (
    languages.some(({ lang }) => selectedLanguages.includes(lang))
  ))
)

Answer 2

Вы можете использовать filter() с проверкой indexOf() для массива selectedLanguages:

var pages= [
   {
      "id":1,
      "name":"name1",
      "languages":[
         {
            "id":1,
            "lang":"en"
         },
         {
            "id":2,
            "lang":"de"
         }
      ]
   },
   {
      "id":2,
      "name":"name2",
      "languages":[
         {
            "id":1,
            "lang":"en"
         },
         {
            "id":2,
            "lang":"de"
         }
      ]
   },
    {
      "id":3,
      "name":"name3",
      "languages":[
         {
            "id":5,
            "lang":"us"
         },
         {
            "id":6,
            "lang":"de"
         }
      ]
   }
];

var selectedLanguages=['en'];

var res = pages.filter((page) => {
   var languageFound = page.languages.find(language => selectedLanguages.indexOf(language.lang) !== -1);
   if(languageFound){
     return page;
   }
});

console.log(res);

Answer 3

Для этого можно использовать комбинацию Array#Filter, Array#find и Array#includes:

let pages= [
   {
      "id":1,
      "name":"name1",
      "languages":[
         {
            "id":1,
            "lang":"en"
         },
         {
            "id":2,
            "lang":"de"
         }
      ]
   },
   {
      "id":2,
      "name":"name2",
      "languages":[
         {
            "id":1,
            "lang":"en"
         },
         {
            "id":2,
            "lang":"fr"
         }
      ]
   }
]

let selectedLanguages=['fr'];

let result = pages.filter(e => e.languages.find(l => selectedLanguages.includes(l.lang)));
console.log(result);