title: Emulate super in javascript
body: <p>Basically is there a good elegant mechanism to emulate <code>super</code> with syntax that is as simple as one of the following</p>
  
  <ul>
  <li><code>this.$super.prop()</code> </li>
  <li><code>this.$super.prop.apply(this, arguments);</code></li>
  </ul>
  
  <p>Criteria to uphold are :</p>
  
  <ol>
  <li><code>this.$super</code> must be a reference to the prototype. i.e. if I change the super prototype at run-time this change will be reflected. This basically means it the parent has a new property then this should be shown at run-time on all children through <code>super</code> just like a hard coded reference to the parent would reflect changes</li>
  <li><code>this.$super.f.apply(this, arguments);</code> must work for recursive calls. For any chained set of inheritance where multiple super calls are made as you go up the inheritance chain, you must not hit the recursive problem.</li>
  <li>You must not hardcode references to super objects in your children. I.e. <code>Base.prototype.f.apply(this, arguments);</code> defeats the point.</li>
  <li>You must not use a X to JavaScript compiler or JavaScript preprocessor.</li>
  <li>Must be ES5 compliant</li>
  </ol>
  
  <p>The naive implementation would be something like this.</p>
  
  <pre><code>var injectSuper = function (parent, child) {
    child.prototype.$super = parent.prototype;
  };
  </code></pre>
  
  <p>But this <a href="http://jsfiddle.net/cMJ6D/3/" rel="noreferrer">breaks condition 2</a>.</p>
  
  <p>The most elegant mechanism I've seen to date is <a href="https://github.com/BonsaiDen/Project-Iar/blob/master/Class.js" rel="noreferrer">IvoWetzel's <code>eval</code> hack</a>, which is pretty much a JavaScript preprocessor and thus fails criteria 4.</p>