title: Good way to chain filter functions in javascript
body: <p>I've got large json array of objects that I need to filter down based on multiple user select inputs. Currently I'm chaining filter functions together but I've got a feeling this is most likely not the most performant way to do this.</p>
  
  <p>Currently I'm doing this:</p>
  
  <pre><code>var filtered = data.filter(function(data) {
      return Conditional1
    })
    .filter(function(data) {
      return Conditional2
    })
    .filter(function(data) {
      return Conditional3
    }) etc...;
  </code></pre>
  
  <p>Although (I think) with each iteration 'data' could be less, I'm wondering if a better practice would be to do something like this:</p>
  
  <pre><code>var condition1 = Conditional1
  var condition2 = Conditional2
  var condition3 = Conditional3
  etc...
  
  var filtered = data.filter(function(data) {
    return condition1 &amp;&amp; condition2 &amp;&amp; condition3 &amp;&amp; etc...
  });
  </code></pre>
  
  <p>I've looked into multiple chains of higher order functions, specifically the filter function - but I haven't seen anything on best practice (or bad practice, nor have I timed and compared the two I've suggested).</p>
  
  <p>In a use case with a large data set and many conditionals which would be preferred (I reckon they are both fairly easily readable)?</p>
  
  <p>Or maybe there is a more performant way that I'm missing (but still using higher-order functions).</p>