Tuesday, August 15th, 2006

Survey of Javascript Inheritance Techniques

Category: JavaScript, Programming

Josh Gertzen of Thinwire has written up a detailed survey of techniques for OO-style inheritance in Javascript, leading up to the technique he’s recently developed to overcome flaws in the existing approaches.

I set out to see if I could devise a working design of my own. It took me about a week to work out something that behaved correctly under all situations, but once I felt confident that it was working, I quickly integrated the approach into the framework. As it stands now, both the beta and beta2 releases of ThinWire leverage that initial design.

His analysis starts with standard prototype chaining techniques (SubClass.prototype = new BaseClass();) and explains where they fall down, in particular problems with calling superclass methods. He then walks through a range of improvements, notably Doug Crockford’s well-known “classic inheritance” technique.

Admittedly, Crockford’s approach is one of the most solid that I found and there is no arguing that based on the body of work he has done on JavaScript programming, he is a master of JavaScript. However, if you review the code for the three classes and then look at the output, you’ll notice that there is subtle issue.

… (I)t should be clear that the results of the above example are incorrect. Additionally, a downside of Crockford’s approach and of many other approaches, is that every super call requires an additional method call and additional processing of some kind. Whether this is an issue for your situation, will depend on how many super calls you have in your code. ThinWire makes extensive use of super calling in it’s client-side code and therefore it’s important that super calls are as fast as possible.

Josh eventually developed an alternative solution that is somewhat Aspect-Oriented:

Essentially, ‘extend’ wraps every method in your class definition with an intermediate function that swaps the super class reference ‘$’ to the correct reference with every method call. The only real issue with this approach is that it requires a number of intermediate functions, which may have an impact on performance.

A further refinement exploits the little-known callee property.

(T)he ‘arguments’ array contains a reference in the property ‘callee’, which points to the current function that is being executed. This is important, because it’s the only way that you can get such a reference since the function reference available via the ‘this’ object, always refers to the overridden function that is defined in the class at the top of the hierarchy.

See Josh’s article for all the code and analysis on Javascript inheritance techniques.

(Thanks to Ted Howard for the link.)

Posted by Michael Mahemoff at 6:05 pm

4.2 rating from 29 votes


Comments feed TrackBack URI

[…] In a post to the front page of Ajaxian.com today, Michael Mahemoff showcases an article written by Joshua Gertzen, the lead developer of the ThinWire Framework: […]

Pingback by ThinWire Ajax Framework Blog :: ThinWire Lead Developer Quoted on Ajaxian.com Front Page — August 17, 2006

Many of these techniques described here are emulations of class-based languages. I believe that most of the usages of such techniques are for programmers that are accustomed to class-based languages like Java. However, JavaScript prototypal based inheritance can actually be much more powerful, and it is much more efficient to the use JavaScript as it is intended than to try to do emulations with it. Even Douglas Crockford has since stated the benefits of using prototypal object inheritance rather than emulating class inheritance: http://javascript.crockford.com/prototypal.html

Comment by Kris Zyp — August 19, 2006

Well, it seems that there new approach to implementing inheritance recently was added – a “lazy inheritance” – http://www.soft-amis.com/jsiner/index.html

Comment by Andrew Sazonov — April 9, 2007

The Javascript inheritance model was prototypal by design. But it is not very straightforward. For further explanation (and a framework that irons out some kinks), see http://devblog.techhead.biz/2009/04/prototype-based-programming-in_04.html

Comment by jhawkes — April 5, 2009

Leave a comment

You must be logged in to post a comment.