Javascript Inheritance Diagrams with GraphViz and Base.js
At my office we’re using XULRunner to deploy a large-scale application platform which requires a hefty Javascript class hierarchy. Due to Javascript’s lack of “true” class inheritance, we were forced to make use of one of the many Javascript OO libraries available. When I stumbled upon Dean Edwards’ Base.js, I was in heaven. It makes Javascript inheritance quite painless and ultimately does what you tell it to:
var Vegetable = Base.extend({
constructor: function() {
// constructor
}
});
var Kale = Vegetable.extend({
constructor: function() {
this.base(); // run vegetable constructor
// ... kale constructor
}
}); ...
However, as any programmer would, I wanted more. We were evolving a substantially complex class hierarchy and documenting this would prove to be cumbersome. I sought a means of creating inheritance diagrams painlessly. My first thought was code interpretation, but I realized that given my timeframe (I wanted to do it in less than an hour), it simply wasn’t an option. That was when I dug into the Base.js code and made a few modifications…