When using MooTools, in order to define a class that extends another we should use the Extends key and assign it with the name of the parent class as its value. In order to invoke a method that was overridden we should use this.parent.
<!DOCTYPE html>
<html>
<head>
<title>mootools functions binding demo</title>
<script type="text/javascript" src="mootools-core-1.4.5-full-compat.js">
</script>
<script type="text/javascript">
var Person = new Class({
//properties
fName: '',
lName: '',
id: 0,
//constructor
initialize: function(first,last,idVal)
{
this.fName = first;
this.lName = last;
this.id = idVal;
},
//methods
sleep: function()
{
document.write(this.fName + ' is sleeping.' + "<br>");
},
talk: function()
{
document.write(this.fName + ' is talking.' + "<br>");
}
});
var Student = new Class({
//inheritance
Extends:Person,
//properties
average:0,
//constructor
initialize: function(first,last,idVal,avgVal)
{
this.parent(first,last,idVal);
average = avgVal;
},
//methods
printDetails: function()
{
document.write(this.fName+" "+this.lName+" "+this.id+" "+average);
}
});
var std = new Student("moshe","jonas",123123,98);
std.printDetails();
</script>
</head>
<body>
</body>
</html>
The following video clip shows the execution of this code sample, overviews it and explains it.
