title: Difference between find() and filter().shift() on javascript
body: <p>I recently starting to drop underscore/lodash overuse on (some of) my projects and realize that there's no full support of <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/find" rel="noreferrer">find</a> method in browsers. What's the difference between ES6 method <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/find" rel="noreferrer">find</a> and using .shift() over <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/filter" rel="noreferrer">filter</a> results</p>
  
  <pre><code>var user = users.find(function() { ... } );
  </code></pre>
  
  <p>or</p>
  
  <pre><code>var user = users.filter(function() { ... } ).shift();
  </code></pre>
  
  <p>I imagine there's obvious optimization over "find" method (stop iterating on fist match), but can I get unexpected results using second approach? Should I use the <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Polyfill" rel="noreferrer">polyfill</a> instead? Why?</p>