title: Why is Array.push(val) faster than an expression like array[array.length] = val?
body: <p>I was watching a JS video by Douglas Crockford and he mentioned a way to "push" an item into an array, without using the <code>Array.push</code> method. It's super simple and something I had never thought of doing, but after doing running a speed test I realize it's slower than <code>Array.push</code>, which doesn't make much sense to me.</p>
  
  <p>How can something like <code>Array.push</code> (which does the same thing as <code>array[array.length] = val</code>, <em>plus</em> other things along with the cost of calling the function itself), be faster than just a plain expression?</p>
  
  <p>Maybe my tests are bad, maybe I have a lack of CS fundamentals here, but if someone can explain the speed differences here I'd really appreciate that. I was simply trying to see if <code>array[array.length] = val</code> was a faster alternative to <code>Array.push</code>, but apparently not. g</p>
  
  <p>This is how <code>Array.push</code> is implemented:</p>
  
  <pre><code>function push(value) {
      var len = this.length;
      this[len] = value;
      len++;
      this.length = len;
      return len;
  }
  </code></pre>
  
  <p>As you can see, it clearly has much more logic then a simple expression, yet it's faster.</p>
  
  <p>Take a look:</p>
  
  <pre><code>let arr = [],
      p1 = performance.now();
  
  for (let i = 1, len = 10; i &lt;= len; i++) {
      arr[arr.length] = i;
  }
  
  let p2 = performance.now();
  
  console.log(p2 - p1);
  </code></pre>
  
  <p>Running the example above, I get 0.015000000001236913, or 0.015 for short.</p>
  
  <p>Now let's look at the <code>Array.push</code>:</p>
  
  <pre><code>let arr = [],
      p1 = performance.now();
  
  for (let i = 1, len = 10; i &lt;= len; i++) {
      arr.push(i);
  }
  
  let p2 = performance.now();
  
  console.log(p2 - p1);
  </code></pre>
  
  <p>Running the example above, I get 0.010000000002037268, or 0.010 for short.</p>
  
  <p><code>Array.push</code> is 0.010, and <code>array[array.length] = val</code> is 0.015, using the same loop.</p>
  
  <p>How can this be? It makes absolutely no sense to me. What am I missing here?</p>