title: Replacing for loops with map method in JavaScript
body: <p>I have this code that is working...</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var allSummaries = [ {id: "1", name: "Example1"},  {id: "2", name: "Example2"}, {id: "3", name: "Example3"}, {id: "4", name: "Example4"},  {id: "5", name: "Example5"}, {id: "6", name: "Example6"}, {id: "7", name: "Example7"}, {id: "8", name: "Example8"}, {id: "9", name: "Example9"}, {id: "10", name: "Example10"}, ];
  
  var uniqueSummaries = ["4","6","9"];
  
  function extractSpecificSummaries(arr1, arr2) {
     var summariesBasedOnIDs = [];
     for (var i = 0; i &lt;= arr1.length - 1; i++) {
        for (var x = 0; x &lt;= arr2.length -1; x++) {
           if (arr1[i].id == arr2[x]) {
             summariesBasedOnIDs.push(arr1[i]);
  
           }
  
        }
     }
     return summariesBasedOnIDs;
  }
  
  
  var summaries = extractSpecificSummaries(allSummaries, uniqueSummaries);</code></pre>
  </div>
  </div>
  </p>
  
  <p>But I want to make it look better by replacing the for loops with the map method. I know there is a simpler way to refactor this code. Does anyone have an idea how to do this?</p>
  
  <p>Thanks!</p>