title: Why Array.prototype.reduce() is not taking an empty array as accumulator?
body: <p>I am trying to filter all the elements in an array which are bigger than 10 to a new array. I am intentionally not using <code>Array.prototype.filter()</code> since I want to learn the <code>reduce()</code> method. Here is the code I was playing with</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var collection = [3, 5, 11, 23, 1];
  
  // fileter all the elements bigger than 10 to a new array
  
  var output = collection.reduce(function(filteredArr, collectionElemet) {
    if (collectionElemet &gt; 10) {
      return filteredArr.push(collectionElemet);
    }
  }, []);</code></pre>
  </div>
  </div>
  </p>
  
  <p>I was expecting that <code>filteredArr</code> would be initialized with an empty array at the time of first callback execution as it happens with many examples provided <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce" rel="noreferrer">here</a>. But when I run this code, I get the error
  <code>Cannot read property 'push' of undefined</code>, where am I messing it up? Thank you!</p>