this.method() and base.method() in JavaScript

I looked around for the problem when you want to inherit from a JavaScript "class" with overriding a method, but I didn't find any solution. Today I tried this, which is working, but not very nice coding:

var mybox = Class.create();
mybox.prototype = {
  update: function() {
    this.div.innerText = new Date();
  }
}

var mybox2 = Class.create();
mybox2.prototype = (new mybox()).extend({
  update: function() {
    this.base_update();
    this.div.innerText += "jjj";
  }
});

As you can see in the mybox2 I can call the base update method using this.base_update(). Are there any other ideas on how to implement inheritance with overriding base methods, but don't losing them?

Published Wednesday, November 02, 2005 3:10 PM by Michael Schwarz

Comments

# re: this.method() and base.method() in JavaScript

Sunday, November 06, 2005 5:03 AM by Hermann Klinke
I am working on a framework that makes this kind of stuff really easy (making javascript really 100% object oriented), but in the meantime you could hack it this way:

//makes it possible to inherit classes
Function.prototype.inherits = function(baseClass)
{
this.prototype = new baseClass;
this.prototype.Base = baseClass.prototype;
//use own constructor
this.prototype.constructor = this.constructor;
};


function BaseClass()
{
}

//method to override
BaseClass.prototype.method = function()
{
alert("base method called.");
}


function DerivedClass()
{
}
//this must be done right after the constructor
DerivedClass.inherits(BaseClass);

//override method
DerivedClass.prototype.method = function()
{
this.Base.method();
alert("new method called.");
}

var instance = new DerivedClass();

instance.method();

I plan on publishing that framework...I could notify you if you are interested.

# re: this.method() and base.method() in JavaScript

Sunday, November 06, 2005 7:12 AM by Michael Schwarz
Yes, I found this at the crockford web site, too. As I can remember I could not use

var instance = new DerivedClass(param1, param2);

where param1 and param2 where used for the BaseClass constructor, too. I'm searching for something like the .inherits method and the Class.create (prototype.js).

# re: this.method() and base.method() in JavaScript

Sunday, November 06, 2005 9:16 AM by Hermann Klinke
Sorry, I don't know prototype.js and I am not sure if I understand your problem. You could use param1 and param2 the same way you do it in C# (well the syntax is a little different):

function BaseClass(method1, method2)
{
this.method1 = method1;
this.method2 = method2;
}

function DerivedClass(method1, method2)
{
this.Base.constructor.call(this, method1, method2);
}


var instance = new DerivedClass(function(){alert("Hello");}, function(){alert("World");});

Hope that helps!

# re: this.method() and base.method() in JavaScript

Tuesday, November 22, 2005 3:54 PM by David Chandler
I'm not sure if this is the correct way to solve the problem, but I was trying to do the same thing today and found that this will work:

var mybox = Class.create();
mybox.prototype.initialize = function() {}
mybox.prototype.update = function() {
alert(new Date());
}

var mybox2 = Class.create();
mybox2.prototype = (new mybox()).extend({
update: function() {
mybox.prototype.update.apply(this, arguments);
alert("jjj");
}
});

var test1 = new mybox();
test1.update();
var test2 = new mybox2();
test2.update();

mybox.prototype.update.apply calls the 'base class' apply method.