Home  >  Article  >  Web Front-end  >  javascript object-oriented programming basics polymorphism_js object-oriented

javascript object-oriented programming basics polymorphism_js object-oriented

WBOY
WBOYOriginal
2016-05-16 18:47:461051browse

Javascript can already simulate object-oriented encapsulation and inheritance features, but unfortunately Javascript's support for polymorphic features is very weak! Polymorphism in other object-oriented languages ​​is generally achieved through method overloading and virtual methods. Javascript also implements polymorphism through these two methods!

Overloading: Since Javascript is a weakly typed language and supports variable parameters, when we define overloaded methods, the interpreter cannot distinguish different overloaded methods through parameter types and number of parameters. , so method overloading is not supported! When methods with the same name are defined successively, the method defined later will overwrite the method defined first!

Since the interpreter cannot distinguish overloaded methods, manually distinguish between different methods:

Copy code Code As follows:

var MyClass=function(){
var AddNum=function(a,b){
return a b;
}
var AddString=function(a ,b){
return "I am here" a b;
}
this.Add=function(a,b){
if(typeof(a)=="number")
return AddNum(a,b);
else
return AddString(a,b);
}
}
var MyObj = new MyClass();
var X = MyObj .Add(5,6);
var Y = MyObj.Add("A","FFFFFF");
alert(X); //Result: 11
alert(Y); // Result: I am hereAFFFFFF

Virtual method:
Copy code The code is as follows:

function BaseClass(){
this.Hello=function(){
return this.Say();
}
}
function MyClassA(){
this.Say=function(){
return "Hello";
}
}
function MyClassB(){
this.Say=function(){
return "This is MyClassB";
}
}
MyClassA.prototype = new BaseClass();
MyClassB.prototype = new BaseClass();
var ObjA = new MyClassA();
var XX = ObjA.Hello();
alert(XX); //Result: Hello
var ObjB = new MyClassB();
var YY = ObjB.Hello();
alert(YY ; Equivalent to a virtual method, it can simulate polymorphism!
Overloading and rewriting (overwriting) of js:
Overloading means, "A function (note that functions are included here) or method with the same name can have multiple implementations, and they depend on parameters Identify by type and/or number of parameters." And overriding (overriding) means, "The subclass can define methods with the same name as those in the parent class, and the same parameter types and numbers. After these methods are defined, in the instantiation object of the subclass, the parent class These methods with the same name inherited from will be hidden". The English word for overloading is overload, and the English word for coverage is override. Okay, that’s the introduction to the concept, do you guess what I’m going to say? Hehe, Code is cheap. Look at the reloaded code:


Copy the code
The code is as follows: / / Implement overloading through the arguments attribute of the function function add() {
var sum = 0;
for ( var i = 0; i < arguments.length; i ) {
sum = arguments[i];
}
return sum;
}
function test() {
alert(add());
alert(add( 1 , 2 ));
alert(add( 1 , 2 , 3 ));
}


Run the result through the code, thus realizing the overloading of any multiple parameter addition function. Of course, you can also use instanceof or constructor to determine the type of each parameter in the function to decide what operations to perform later and implement more complex function or method overloading. In short, JavaScript overloading is implemented by the user himself in the function by manipulating the arguments attribute. Regarding the characteristics of arguments, I have given a brief introduction before. Please refer to my article: http://blog.csdn.net/zhanglingdll_39/archive/2009/08/20/4465670.aspx.
The following focuses on understanding the implementation of js rewriting:
// Adding a static method inherit to a class means inheriting from a certain class
Function.prototype.inherit = function (baseClass) {
for ( var p in baseClass.prototype) {
this .prototype[p] = baseClass.prototype[p];
}
}
// js implementation rewrite
function parentClass() { // parent Class
}
parentClass.prototype.method = function () {
alert( " parentClass method " );
}
function subClass() { // Subclass
}
//



Copy code
The code is as follows:

The following sentence is equivalent to subClass.prototype = new parentClass();
subClass.inherit(parentClass);
// subClass.prototype.method = function() { // Subclass Rewritten the method of the parent class - remove the comments and try running
// alert("subClass method");
// }
function test() {
var obj = new subClass( );
obj.method();
}
In this way, the method defined in the subclass overrides the method inherited from the parent class. You may ask, how to call the method of the parent class in the subclass? Okay, let’s look at the implementation as follows:
// Adding a static method inherit to a class means inheriting from a certain class
Function.prototype.inherit = function (baseClass) {
for ( var p in baseClass.prototype) {
this .prototype[p] = baseClass.prototype[p];
}
}
/* Reference article: http://menjoy.javaeye.com/blog/127847 */
//js implementation rewrites
function parentClass() {
this .method = function () {
alert( " parentClass method " );
}
}
function subClass () {
var method = this .method;
this .method = function () {
method.call( this );
alert( " subClass method " );
}
}
subClass.prototype = new parentClass();
// subClass.inherit(parentClass); //This sentence seems to be equivalent to the previous sentence subClass.prototype = new parentClass();, but is it actually? ? ? ? (Comment the previous line and run this line to see)
subClass.prototype.constructor = subClass;
function test() {
var obj = new subClass();
obj.method();
}

Okay, that’s it for the introduction to polymorphism. JS object-oriented programming is like a vast ocean. The three basics of JS object-oriented programming I wrote based on other people's articles can only be used as a reference for beginners to learn. There is no end to learning. I have referred to several great articles written by experts on the Internet. I am fully aware of the shallowness of my own skills. For readers who have surpassed the stage of understanding, it is better to read the technical articles written by experts in the garden. I would like to thank the experts in the garden first.
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn