title: How to merge two arrays into one using .map and .filter
body: <p>Using two selects to database I'm returning two arrays &quot;Movies&quot; and &quot;Comments&quot; and I must to merge this arrays based on &quot;movieId&quot; into one and send it back to client in response.</p>
  <p>Movies:</p>
  <pre><code>[
      {
          &quot;movieId&quot;: &quot;0DD20C53-FF5C-EB11-8140-707781834352&quot;
      },
      {
          &quot;movieId&quot;: &quot;01C14AF4-3E37-EB11-8138-778184434310&quot;
      },
  ]
  </code></pre>
  <p>Comments:</p>
  <pre><code>[
      {
          &quot;commentId&quot;: &quot;1&quot;,
          &quot;movieId&quot;: &quot;0DD20C53-FF5C-EB11-8140-707781834352&quot;,
          &quot;content&quot;: &quot;thanks&quot;
      },
  ]
  </code></pre>
  <p>And in that case I want this result:</p>
  <pre><code>[
        {
          movieId: &quot;0DD20C53-FF5C-EB11-8140-707781834352&quot;,
          comments: [
            {
              commentId: &quot;1&quot;,
              movieId: &quot;0DD20C53-FF5C-EB11-8140-707781834352&quot;,
              content: &quot;thanks&quot;,
            },
          ],
        },
        {
          movieId: &quot;01C14AF4-3E37-EB11-8138-778184434310&quot;,
          comments: [],
        },
      ];
  </code></pre>
  <p>Currently I wrote this code, but something is wrong because comment is added to both movies so something is wrong with checking movie.movieId = comment.movieId. Can someone tell me how to use .map and .filter correctly or better solution to that case? Maybe there is something better for performance.</p>
  <pre><code>let result = movies.map((movie) =&gt; ({
        ...movie,
        comments: comments.filter((comment) =&gt; {
          comment.movieId = movie.movieId;
        }),
      }));
  </code></pre>