Можно ли получить список всех элементов в массиве объектов, которые соответствуют элементам в другом массиве?

Question

Я работаю над проектом React, который позволит мне искать в списке игр, чтобы помочь мне решить, во что играть, исходя из того, к чему у меня настроение, в настоящее время я могу добавлять игры в файл JSON.но я действительно борюсь с поисковой частью.

Прямо сейчас, чтобы добавить новую игру, вы должны ввести название, жанр (ы) и описание игры.Поле жанра - это объект ReduxForm FieldArray, и я думаю, что это доставляет мне неприятности.Вот мой текущий файл JSON

{
  "games": [
    {
      "name": "Rainbow Six: Siege",
      "genres": [
        {
          "genre": "tactical"
        },
        {
          "genre": "shooter"
        }
      ],
      "description": "tactical team based shooter",
      "id": 1
    },
    {
      "name": "Resident Evil 2",
      "genres": [
        {
          "genre": "horror"
        },
        {
          "genre": "survival"
        },
        {
          "genre": "shooter"
        }
      ],
      "description": "classic resident evil 2 remake in 2019",
      "id": 2
    },
    {
      "name": "Rocket League",
      "genres": [
        {
          "genre": "cars"
        },
        {
          "genre": "competition"
        },
        {
          "genre": "one more game"
        }
      ],
      "description": "soccar!",
      "id": 3
    }
  ]
}

Это фиктивные данные, которые я использую для поиска:

const searchedGenres = 'horror, shooter';
const searchedList = searchedGenres.split(', ');
let foundGame = [];

Как только я получу поиск, работающий с этими данными, план должен позволитьмне просто ввести данные о веб-интерфейсе в одном текстовом поле, чтобы моим поисковым термином был «ужас, стрелок».Результат этого поиска должен only вернуть Resident Evil 2, однако в результате я также получаю Rainbow Six: Siege, хотя в нем отсутствует один из моих запрошенных жанров.

searchedList.forEach(searchedGenre => {
  this.props.games.map(game => {
    if (
      game.genres.find(
        ({ genre }) =>
          genre.toLowerCase() ===
          searchedGenre.toLowerCase().trim()
      ) !== undefined
    ) {
      foundGames.push(game);
    }
  });
});

Я понимаю почему В результате я получаю и Rainbow Six, и Resident Evil, потому что на самом деле я не проверяю, что оба жанра относятся к жанрам игр, когда я добавляю игрук массиву foundGames, но я совершенно заблудился о том, как сделать так, чтобы все жанров были в игре, прежде чем я ее добавлю.

Answer 1

Это было бы немного проще, если бы ваши жанры представляли собой простой массив строк, а не объектов, но все же вы можете проверить довольно кратко, используя some() и every() в filter() (кстати, filter() лучше выбор чем map() + push() здесь)

let games = [{"name": "Rainbow Six: Siege","genres": [{"genre": "tactical"},{"genre": "shooter"}],"description": "tactical team based shooter","id": 1},{"name": "Resident Evil 2","genres": [{"genre": "horror"},{"genre": "survival"},{"genre": "shooter"}],"description": "classic resident evil 2 remake in 2019","id": 2},{"name": "Rocket League","genres": [{"genre": "cars"},{"genre": "competition"},{"genre": "one more game"}],"description": "soccar!","id": 3}]

const searchedGenres = 'horror, shooter';
const searchedList = searchedGenres.split(', ');

let foundGame = games.filter(game => searchedList.every(searchItem => game.genres.some(g => g.genre == searchItem) ))
console.log(foundGame)

Условие фильтра в основном говорит о том, что вы хотите, чтобы каждая игра в searchedList соответствовала хотя бы одному жанру в игре. Это позволит возвращать только те игры, которые соответствуют каждому жанру.