title: When extending Array in Javascript, why does this.length mismatch with this' content?
body: <p>Say I want to extend Array with a to_html() method:</p>
  
  <pre><code>Array.prototype.to_html = function() {
    console.log(this.length);
  
    for(var i in this) {
      console.log(this[i]);
    }
  };
  </code></pre>
  
  <p>And I have an array:</p>
  
  <pre><code>var arr = [1, 2, 3];
  </code></pre>
  
  <p>When calling <code>arr.to_html()</code>, the first line in console looks fine:</p>
  
  <pre><code>3
  </code></pre>
  
  <p>So far so good. But here are the following lines:</p>
  
  <pre><code>1
  2
  3
  function() {
    console.log(this.length);
  
    for(var i in this) {
      console.log(this[i]);
    }
  }
  </code></pre>
  
  <p>Oops, where does the fourth element come from? How can I get rid of it?</p>