How to filter items from Array of Array in Javascript

Question

How can you filter movie title on the basis of Genre item in array?

const result = [
  {
    title: "Mad Max: Fury Road",
    genre: ["Action", "Adventure", "Sci-Fi"],
  },
  {
    title: "The Hunger Games: Mockingjay Part 1",
    genre: ["Adventure", "Thriller"],
  },
  {
    title: "Jurassic World",
    genre: ["Action", "Adventure", "Sci-Fi"],
  },
  {
    title: "Everest",
    genre: ["Drama", "Thriller"],
  },
  {
    title: "Insurgent",
    genre: ["Adventure"],
  },
  {
    title: "Sicario",
    genre: ["Action", "Crime", "Drama"],
  },
];

Suppose if I want to filter movie title name on the basis of genre eg: "Sci-Fi" then it should return array of movie titles eg: ["Mad Max: Fury Road", "Jurassic World"].

Tried various combinations of map and filter but not working.

const newResult = result
  .map((curr) => curr.genre.filter((ele) => ele === search))
  .filter((ele) => ele);

Swiffy · Answer 1 · 2022-06-19T14:46:40.150

We use filter to return all movies that pass some condition.

For the passing condition of filter, we use every on the supplied array of genres.

every returns true if all of the elements in the array (genreList) it was called on return true for some condition.

For the condition of every, we check that the movie's genre array includes the entry in the given genreList array.

So in english, this code says "Please give me all movies that have all of the genres given in genreList".

const result= [
    {
      "title": "Mad Max: Fury Road",
      "genre": [
        "Action",
        "Adventure",
        "Sci-Fi"
      ]
    },
    {
      "title": "The Hunger Games: Mockingjay Part 1",
      "genre": [
        "Adventure",
        "Thriller"
      ]
    },
    {
      "title": "Jurassic World",
      "genre": [
        "Action",
        "Adventure",
        "Sci-Fi"
      ]
    },
    {
      "title": "Everest",
      "genre": [
        "Drama",
        "Thriller"
      ]
    },
    {
      "title": "Insurgent",
      "genre": [
        "Adventure"
      ]
    },
    {
      "title": "Sicario",
      "genre": [
        "Action",
        "Crime",
        "Drama"
      ]
    }
  ];
  
const moviesByGenres = (moviesList, genreList) => {
  return moviesList.filter((m) => {
    return genreList.every((g) => m.genre.includes(g));
  });
}

// All action movies
console.log(moviesByGenres(result, ["Action"]));

// All action+adventure movies
console.log(moviesByGenres(result, ["Action", "Adventure"]));

score 1 · Answer 2 · answered Jun 19 '22 at 16:56

Use Array#filter to select the relevant items that meet the set criteria and use Array#map to select the properties of the selected items that you're interested in.

const result= [ { "title": "Mad Max: Fury Road", "genre": [ "Action", "Adventure", "Sci-Fi" ] }, { "title": "The Hunger Games: Mockingjay Part 1", "genre": [ "Adventure", "Thriller" ] }, { "title": "Jurassic World", "genre": [ "Action", "Adventure", "Sci-Fi" ] }, { "title": "Everest", "genre": [ "Drama", "Thriller" ] }, { "title": "Insurgent", "genre": [ "Adventure" ] }, { "title": "Sicario", "genre": [ "Action", "Crime", "Drama" ] } ],
  
      search = "Sci-Fi";

      newResult = result
      //which items meet the set criteria?
      .filter(({genre}) => genre.includes(search))
      //what about those items am I zeroing in on?
      .map(({title}) => title);

console.log( newResult );

score 0 · Answer 3 · answered Jun 19 '22 at 13:35

0

Found the answer after trial and error

const n = result.filter((curr) => curr['genre'].includes("Action"))

answered Jun 19 '22 at 13:35

Jacob

101
2
5
11

Do check my solution as well. It supports filtering by multiple genres at the same time. So if you want to filter movies that are, e.g. both "Action" and "Adventure" at the same time, you can do that. – Swiffy Jun 19 '22 at 13:40
Thanks this was useful, however requirement is that suppose if i want to filter in search box for movie it should take only 1 genre type not an array of search but thanks a lot for taking time and helping :) – Jacob Jun 19 '22 at 13:44

How to filter items from Array of Array in Javascript

3 Answers3