获取具有属性的数组中的对象，该属性是包含匹配值的数组

Question

I have an Array of Objects with a structure like this:

[
  {
    title: "", 
    imagePoster: "", 
    episodes: "", 
    score: "",
    genres: ["Comedy", "Drama", ...],
    description: ""
  },
  ...
]

I need to return an Object which contains specific value like "Comedy" in the genres Array. I've been trying a lot of ways like for , filter , map , indexOf ... But, I still can't figure it out, unless I search for ["Comedy", "Drama", ...] (ie, the whole Array).

Answer 1

You could use Array#find to find the first element that satisfies the condition:

const search = "Comedy";
const found = array.find(obj => obj.genres.includes(search));

This also uses Array#includes which checks if the argument, the search keyword, exists in the genres array of each object. And if you needed IE support, use Array#indexOf and check if the return value is greater than -1 instead which does exactly the same thing:

obj => obj.genres.indexOf(search) > -1

And if you wanted to return all objects that have a certain genre, not just the first one, filter the array with Array#filter which filters the array based on a condition:

const search = "Comedy";
const found = array.filter(obj => obj.genres.includes(search));

This will filter the array and only leave the objects that include the search keyword in their genres array. Again, you can swap out includes for the indexOf check, and you can always just access the first element of the filtered array if find is not supported on your target browsers (namely IE).

Answer 2

Array.find & Array.includes are your friends. There are also polyfills for non-browsers :)

The most supported way would be to use Array.filter & Array.indexOf

function getMovieByGenre(genre) {
  return movies.filter(function(movie) {
    return movies.genres.indexOf(genre) >= 0
  })[0];
}

var someComedy = getMovieByGenre('Comedy');
if (someComedy) {
  // movie found
}

I am using the most supported code, without polyfills and ES6 features