Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Override function in JavaScript [duplicate]

Possible Duplicate:
Calling base method using JavaScript prototype

I want to inheritance object that will override function in javascript.

From the method I want to call to the base method. In this case I inherit object reader from Person and now I want to override the function getName meaning that in reader first I want to call the function on Person and then to do some changes.

<script>     /* Class Person. */     function Person(name) {         this.name = name;     }     Person.prototype.getName = function() {         return this.name;     }      var reader = new Person('John Smith');     reader.getName = function() {         // call to base function of Person, is it possible?         return('Hello reader');     }     alert(reader.getName()); </script> 
like image 588
user1365697 Avatar asked Jul 18 '12 13:07

user1365697


People also ask

Can I override function in JavaScript?

Introduction. It is true that JavaScript supports overriding, not overloading. When you define multiple functions that have the same name, the last one defined will override all the previously defined ones and every time when you invoke a function, the last defined one will get executed.

How do you overwrite a function?

To override a function you must have the same signature in child class. By signature I mean the data type and sequence of parameters. Here we don't have any parameter in the parent function so we didn't use any parameter in the child function.

Can we override prototype in JavaScript?

Since you are correctly overriding the function on the object itself and not on its prototype, you can still call the prototype function with your object. reader. getName = function() { var baseName = Person. prototype.


2 Answers

Vincent answered your direct question but here is what you would do if you would like to set up a true inheritance hierarchy where you can further extend Reader.

Create your person class:

function Person(name) {     this.name = name; }  Person.prototype.getName = function(){     alert('Person getName called for ' + this.name);     return this.name; } 

Create a Reader class as well:

function Reader(name) {     // Calls the person constructor with `this` as its context     Person.call(this, name); }  // Make our prototype from Person.prototype so we inherit Person's methods Reader.prototype = Object.create(Person.prototype);  // Override Persons's getName Reader.prototype.getName = function() {     alert('READER getName called for ' + this.name);     // Call the original version of getName that we overrode.     Person.prototype.getName.call(this);     return 'Something'; } Reader.prototype.constructor = Reader; 

And now we can repeat a similar process to extend Reader with say a VoraciousReader:

function VoraciousReader(name) {     // Call the Reader constructor which will then call the Person constructor     Reader.call(this, name); }  // Inherit Reader's methods (which will also inherit Person's methods) VoraciousReader.prototype = Object.create(Reader.prototype); VoraciousReader.prototype.constructor = VoraciousReader;  // define our own methods for VoraciousReader //VoraciousReader.prototype.someMethod = ... etc. 

fiddle: http://jsfiddle.net/7BJNA/1/

Object.create: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/create

Object.create(arg) is creating a new object whose prototype is what was passed in as an argument.

Edit Its been years since this original answer and now Javascript supports the class keyword which works as you'd expect if you're coming from language like Java or C++. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes

like image 113
Matt Wonlaw Avatar answered Oct 04 '22 00:10

Matt Wonlaw


Since you are correctly overriding the function on the object itself and not on its prototype, you can still call the prototype function with your object.

reader.getName = function() {     var baseName = Person.prototype.getName.call(this);     ... } 
like image 23
Vincent Robert Avatar answered Oct 04 '22 01:10

Vincent Robert