JavaScript inheritance: How to call my parent method?

Consider example:

Animal = function(age) {
this.age = age;
};

Animal.prototype.sleep = function() {
alert("Animal Sleeping...");
};

Human = function(name, age) {
this.name = name;
this.age = age;
};

Human.prototype = new Animal();

Human.prototype.sleep = function() {
// How to call my parent sleep();
};

var h = new Human("Peter", 15);
h.sleep();

I want inside the sleep() method of Human class, call to its parent
sleep() method.


Any idea?

Thanks.

howa wrote:
[snip]

Any idea?

Try googling "javascript inheritance"

On Jun 11, 5:17 pm, howa wrote:

Consider example:

Animal = function(age) {
this.age = age;

};

Why no declaration for the - Animal - variable, and why assign a
function expression here when a function declaration would be the more
natural means of getting the constructor into existance?

Animal.prototype.sleep = function() {
alert("Animal Sleeping...");

};

Human = function(name, age) {
this.name = name;
this.age = age;

};

Human.prototype = new Animal();

Human.prototype.sleep = function() {
// How to call my parent sleep();

};

var h = new Human("Peter", 15);
h.sleep();

I want inside the sleep() method of Human class, call to
its parent sleep() method.

Any idea?

If you must then:-

Human.prototype.sleep = function() {
Animal.prototype.sleep.call(this);
};

- will do what you ask, but you should be able to design that desire
out of system.

Richard.

Henry <rcornford (AT) raindrop (DOT) co.uk> writes:

If you must then:-

Human.prototype.sleep = function() {
Animal.prototype.sleep.call(this);
};

- will do what you ask, but you should be able to design that desire
out of system.

Agreed, though there are some situations where this is more or less
the only sane solution and trying to design it away won't make things
better. Inheritance already couples the objects pretty rigidly, so one
more reference to the "super" object won't hurt much.

J.

--
Joost Diepenmaat | blog: http://joost.zeekat.nl/ | work: http://zeekat.nl/

howa <howachen (AT) gmail (DOT) com> writes:

Consider example:

Animal = function(age) {
this.age = age;
};

Animal.prototype.sleep = function() {
alert("Animal Sleeping...");
};

Human = function(name, age) {
this.name = name;
this.age = age;
};

Human.prototype = new Animal();

Ok, considering this example, you say that all humans inherit
from the same animal. Not from the "class" of objects created
by the Animal constructor, but from a specific object.

That's just wrong.

The animal used as prototype for humans doesn't have an age,
like other animals (or rather, it does have an "age" property,
but with the "undefined" value). If it did have an age, a proper
animal, then all humans would inherit that same date.


Inheritance in Javascript is between objects, not between
constructors (and not between classes, since there are none).
You appear to be trying to do class based inheritance in
Javascript. While probably possible to emulate, it won't
be easy, nor natural.

Human.prototype.sleep = function() {
// How to call my parent sleep();

Others have given examples. Another extreme example would be:

Human.prototype.sleep = function() {
delete this.sleep;
this.sleep();
this.sleep = arguments.callee;
}

Again, it's not something you want to do. Rather do something like:

Human.prototype.sleep = (function(){
var parentSleep = Human.prototype.sleep; // original value
return function() {
// something
parentSleep.call(this);
}
})();


/L
--
Lasse Reichstein Nielsen - lrn (AT) hotpop (DOT) com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Howa,

howa <howachen (AT) gmail (DOT) com> writes:

Consider example:

Animal = function(age) {
this.age = age;
};

Animal.prototype.sleep = function() {
alert("Animal Sleeping...");
};

Human = function(name, age) {
this.name = name;
this.age = age;
};

Human.prototype = new Animal();

Human.prototype.sleep = function() {
// How to call my parent sleep();
};

var h = new Human("Peter", 15);
h.sleep();

I want inside the sleep() method of Human class, call to its parent
sleep() method.

Using the YAHOO!'s YUI class-based-inheritance-emulating functions, you
could do (untested)

Animal = function (a) {
...
}

Animal.prototype.sleep = function (t) {

...
}


Human = function (a) {

Animal.apply (this, arguments);
}


YAHOO.extend (Human, Animal);


Human.prototype.sleep = function (t) {

... // do some stuff

Human.superclass.sleep.call (this, t);

... // do some more stuff
}


-----

HTH,
Arnaud

Any idea?

Thanks.

On Jun 13, 8:41 am,
a... (AT) remove (DOT) this.and.keep.what.follows.ionicsoft.com (Arnaud Diederen
(aundro)) wrote:

Howa,



howa <howac... (AT) gmail (DOT) com> writes:
Consider example:

Animal = function(age) {
this.age = age;
};

Animal.prototype.sleep = function() {
alert("Animal Sleeping...");
};

Human = function(name, age) {
this.name = name;
this.age = age;
};

Human.prototype = new Animal();

Human.prototype.sleep = function() {
// How to call my parent sleep();
};

var h = new Human("Peter", 15);
h.sleep();

I want inside the sleep() method of Human class, call to its parent
sleep() method.

I would do just exactly that - explicitly:-

sleep : function(t) {
Animal.prototoype.sleep.call(this, t);
}

Using the YAHOO!'s YUI class-based-inheritance-emulating functions, you
could do (untested)

The OP is interested in understanding how to solve the problem.

The function itself, with my comments interspersed:-

/**
* Utility to set up the prototype, constructor and superclass
properties to
* support an inheritance strategy that can chain constructors and
methods.
* Static members will not be inherited.
*
* @method extend
* @static
* @param {Function} subc the object to modify
* @param {Function} superc the object to inherit
* @param {Object} overrides additional properties/methods to add
to the
* subclass prototype. These will
override the
* matching items obtained from the
superclass
* if present.
*/
extend: function(subc, superc, overrides) {
if (!superc||!subc) {

// GS: Safe to omit - new - keyword.
throw new Error("extend failed, please check that " +
"all dependencies are included.");
}
var F = function() {};
F.prototype=superc.prototype;
subc.prototype=new F();
subc.prototype.constructor=subc;
subc.superclass=superc.prototype;

// GS: Consider using === (may result in increased performance in
JScript).
if (superc.prototype.constructor ==
Object.prototype.constructor) {
superc.prototype.constructor=superc;
}

if (overrides) {
for (var i in overrides) {

// GS: Important call to hasOwnProperty.
if (L.hasOwnProperty(overrides, i)) {
subc.prototype[i]=overrides[i];
}
}

L._IEEnumFix(subc.prototype, overrides);
}
},

Another possibility is to cache the function being new'd. One possible
way to accomplish this is to use the one the Activation object is in -
arguments.callee:-

var f = arguments.callee;

But this requires a check in the - extend - function, which gets
recursed.

if(arguments.length === 0) return;

It's good to see that YAHOO has finally fixed some of the significant
bugs in this code.

Animal = function (a) {
...

}

Animal.prototype.sleep = function (t) {

...

}

Human = function (a) {

Animal.apply (this, arguments);

}

YAHOO.extend (Human, Animal);

Human.prototype.sleep = function (t) {

... // do some stuff

Human.superclass.sleep.call (this, t);

Did you mean:

Human.superclass.prototype.sleep.call(this, t)

- ?

Or more explicit:-

Animal.prototype.sleep.call(this, t);


Garrett

HTH,
Arnaud