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?

4 Comments

  • 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.

  • 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).

  • 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!

  • 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.

Comments have been disabled for this content.