title: Looping through an array to filter an array of objects
body: <p>I have trouble finding a way to loop through the elements of an array to filter another array of objects. I found a way to iterate through the this.productID when there's only one item, but when this.productID is an array, the  elements are shown with their content tagged as undefined.</p>
  
  <p>Thanks for the help!</p>
  
  <p>Note: productLib is passed down as product from its parent component</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-html lang-html prettyprint-override"><code>export class Product extends React.Component {
      constructor(props){
          super(props);
  
          this.productID = this.props.product.similarItems;
          this.filterProductById = this.filterProductById.bind(this);
      }
  
      filterProductById() {
          return this.productID.map(ID =&gt; {
              return productLib.filter(product =&gt; {                    
                  return product.ID === ID
              })
          })}
  
          /*
          The code below only works when there's a single string in this.productID
          return productLib.filter(product =&gt; {
              return product.ID === this.productID
          })}*/
          
          
      render() {
          return(
              
                  &lt;div className="recommended"&gt;
                      {
                      this.filterProductById().map(product =&gt; {
                          return &lt;Products product={product} key={product.ID}/&gt;
                      })
                      }
                  &lt;/div&gt;
          )
      }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Here is how the data in productLib is formated:</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-html lang-html prettyprint-override"><code>export const productLib = [
      {
      ID: "001",
      
      ...,
      
      similarItems: ["004", "002", "001", "015"],
      },
      {...},
      ...
  ]</code></pre>
  </div>
  </div>
  </p>