Class-Based Inheritance in JavaScript

Good news!

Yahoo! just announced YUI v0.11 and they included a variation of Kevin's extend function as one of their three fundamental functions in the top level YAHOO namespace.

YAHOO.extend = function(subclass, superclass) {
    var f = function() {};
    f.prototype = superclass.prototype;
    subclass.prototype = new f();
    subclass.prototype.constructor = subclass;
    subclass.superclass = superclass.prototype;
    if (superclass.prototype.constructor == Object.prototype.constructor) {
        superclass.prototype.constructor = superclass;
    }
};

Some links about it...

• Announcement
• Docs
• YUI v0.11 Source

Kevin now has a blog post about the inclusion of YAHOO.extend in v0.11. Congrats to Kevin!

Perl is not so pretty.

package Person;

sub new {
  my $invocant = shift;
  my $this = ref( $invocant) ? $invocant : bless({}, $invocant); 
  my ($first, $last) = @_;
  $this->{first} = $first;
  $this->{last} = $last;
  return $this;
}

sub toString {
  $this = shift;
  return $this->{first} . ' ' . $this->{last};
}

#-------------------------------------------------------------------

package Employee;
our @ISA = ('Person');

sub new {
  my $invocant = shift;
  my $this = ref( $invocant) ? $invocant : bless({}, $invocant); 
  my ($first, $last, $id) = @_;
  $this->SUPER::new($first, $last);
  $this->{id} = $id;
  return $this;
}

sub toString {
  my $this = shift;
  return $this->SUPER::toString() . ': ' . $this->{id};
}

#-------------------------------------------------------------------

package Manager;
our @ISA = ('Employee');

sub new {
  my $invocant = shift;
  my $this = ref( $invocant) ? $invocant : bless({}, $invocant); 
  my ($first, $last, $id, $department) = @_;
  $this->SUPER::new($first, $last, $id);
  $this->{department} = $department;
  return $this;
}

sub toString {
  my $this = shift;
  return $this->SUPER::toString() . ': ' . $this->{department};
}

There is another approach to implement JavaScript inheritance - a "lazy" inheritance which has all benefits of "prototype" based approach like typed classes, but also eliminates necessity to declare external scripts in proper order and automatically resolves and loads (if necessary) dependencies to external scripts that contains related classes. This approach is supported by JSINER library - you can find more about it on http://www.soft-amis.com/jsiner/inheritance.html.

Perl doesn't have to be so long winded. I'd tend to do this with an object maker like Class::Std or Moose, but this is core Perl.

package Person;

sub new {
    my $self = bless {}, shift;
    @$self{qw(first last)} = @_;
    $self;
}

sub toString {
    my ($self) = @_;
    join(" ", @$self{qw(first last)});
}

#-------------------------------------------------------------------

package Employee;
use base 'Person';

sub new {
  my $self = shift->SUPER::new(@_[0,1]);
  $self->{id} = $_[2];
  $self;
}

sub toString {
  my ($self) = @_;
  join(": ", $self->SUPER::toString(), $self->{id});
}

#-------------------------------------------------------------------

package Manager;
use base 'Employee';

sub new {
  my $self = shift->SUPER::new(@_[0,1,2]);
  $self->{department} = $_[3];
  $self;
}

sub toString {
  my ($self) = @_;
  join(": ", $self->SUPER::toString(), $self->{department});
}

"use strict,ses";

// Given ES3.1, here's a strict program that does
// http://peter.michaux.ca/articles/class-based-inheritance-in-javascript
// using Crock's objects-as-closures style adapted for single
// inheritance and nominal typing. In proposed SES, where functions
// are implicitly frozen on first use or escaping occurrence, the
// following code also follows capability discipline. Otherwise, in
// order to conform to capability discipline, all functions below
// would need to be explicitly frozen or replaced with ES-Harmony's
// proposed lambdas (which are implicitly frozen).

//------------------------------------------------------------------
// Infrastructure, given ES3.1
// For pre-ES3.1 support, see last section below

function copy(src) {
 return Object.create(Object.getPrototypeOf(src),
                      Object.getOwnProperties(src));
}

function snapshot(src) {
 return Object.freeze(copy(src));
}

function makeMaker(Super, initer) {
 function Maker(var_args) {
   var self = Object.create(Maker.prototype);
   initer.apply(undefined, [self].concat(Array.slice(arguments, 0)));
   return Object.freeze(self);
 }
 Maker.init = initer;
 Maker.prototype = Object.freeze(Object.create(Super.prototype, {
   constructor: {value: Maker}
 }));
 return Maker;
}

//------------------------------------------------------------------

var Person = makeMaker(Object,
                      function(self, first, last) {
 self.toString = function() {
   return first + ' ' + last;
 };
});

//------------------------------------------------------------------

var Employee = makeMaker(Person,
                        function(self, first, last, id) {
 Person.init(self, first, last);
 var super = snapshot(self);
 self.toString = function() {
   return super.toString() + ': ' + id;
 };
});

//------------------------------------------------------------------

var Manager = makeMaker(Employee,
                       function(self, first, last, id, department) {
 Employee.init(self, first, last, id);
 var super = snapshot(self);
 self.toString = function () {
   return super.toString() + ': ' + department;
 };
});


//------------------------------------------------------------------
// Corresponding Infrastructure, given a pre-ES3.1 platform with __proto__

Object.create = function(parent) {
 function F(){}
 F.prototype = parent;
 return new F();
}

Object.freeze = function(value) { return value; };

function copy(src) {
 var result = Object.create(src.__proto__);
 for (var k in src) {
   if (Object.prototype.hasOwnProperty.call(src, k)) {
     result[k] = src[k];
   }
 }
 return result;
}

function snapshot(src) {
 return copy(src);
};

function makeMaker(Super, initer) {
 function Maker(var_args) {
   var self = Object.create(Maker.prototype);
   initer.apply(undefined, [self].concat(Array.slice(arguments, 0)));
   return Object.freeze(self);
 }
 Maker.init = initer;
 Maker.prototype = Object.create(Super.prototype);
 Maker.prototype.constructor = Maker;
 return Maker;
}

It's not clear to me that the snapshots above should preserve the implicit prototype of the original. So long as the super value is only used internally to do super calls, it doesn't matter. But if, for example, Manager.init leaks its super value, it is not good that this value would pass an "... instanceof Manager" test, since it does not represent a valid instance of a Manager. Neither in general is it a valid instance of Employee, since the "self" captured by its methods will eventually refer to a fully initialized instance of Manager.

Perhaps "super" should instead only be a frozen record inheriting directly from Object.prototype.