inherited
Inheritance is an essential feature of object-oriented languages, that is, a class can reuse methods and properties of another class. There are five ways to implement inheritance in JavaScript: Object posing, call (), apply (), prototype chain, blending mode.
The following are described separately.
Object impersonate
Rationale: Constructors Use the This keyword to assign values to all properties and methods. Because the constructor is just a function, you can make the ClassA constructor a ClassB method and call it. CLASSB will receive the properties and methods defined in the ClassA constructor.
Example:
Copy Code code as follows:
function ClassA (scolor) {
This.color=scolor;
This.saycolor=function () {
alert (This.color);
}
}
function ClassB (scolor,sname) {
This.newmethod=classa;
This.newmethod (Scolor);
Delete This.newmethod;
This.name=sname;
This.sayname=function () {
alert (this.name);
}
}
Call:
Copy Code code as follows:
var objb=new classb ("Blue", "Test");
Objb.saycolor ()//
Blueobjb.sayname (); Test
Note: This is to remove references to ClassA, otherwise defining the new methods and properties later overrides the related properties and methods of the superclass. Multiple inheritance can be implemented in this way.
Call () method
Due to the prevalence of object impersonation methods, in the third edition of ECMAScript, two new methods called () and apply () methods were added to the function object to achieve similar functions.
The first parameter of the call () method is used as the object of this, and other parameters are passed directly to the function itself. Example:
Copy Code code as follows:
function Saycolor (sprefix,ssuffix) {
alert (Sprefix+this.color+ssuffix);
}
var obj=new Object ();
Obj.color= "Red";
Output the color is red, a very nice color indeed.
Saycolor.call (obj, "The color is", ", a very nice color indeed.");
Using this method to implement inheritance, you only need to replace the first three rows with assignment, invocation, and deletion code:
Copy Code code as follows:
function ClassB (scolor,sname) {
This.newmethod=classa;
This.newmethod (Scolor);
Delete This.newmethod;
Classa.call (This,scolor);
This.name=sname;
This.sayname=function () {
alert (this.name);
}
}
apply () method
The Apply () method is similar to the call () method, unlike the second argument, which passes an array in the Apply () method.
Copy Code code as follows:
function Saycolor (sprefix,ssuffix) {
alert (Sprefix+this.color+ssuffix);
}
var obj=new Object ();
Obj.color= "Red";
Output the color is red, a very nice color indeed.
Saycolor.apply (Obj,new Array ("The Color is", ", a very nice color indeed.");
Using this method to implement inheritance, you only need to replace the first three rows with assignment, invocation, and deletion code:
Copy Code code as follows:
function ClassB (scolor,sname) {
This.newmethod=classa;
This.newmethod (Scolor);
Delete This.newmethod;
Classa.apply (this,new Array (Scolor));
This.name=sname;
This.sayname=function () {
alert (this.name);
}
}
The difference with call () is that if the order of the parameters in the superclass is exactly the same as the order of the parameters in the subclass, the second argument can be arguments.
prototype chain
This form of inheritance was originally used for the prototype chain in ECMAScript. Any properties and methods of the prototype object are passed to all instances of that class. The prototype chain uses this function to implement the inheritance mechanism.
Implementing an inheritance example with a prototype chain:
Copy Code code as follows:
function ClassA () {
}
Classa.prototype.color= "Red";
Classa.prototype.saycolor=function () {
alert (This.color);
};
function ClassB () {
}
Classb.prototype=new ClassA ();
Note: When the ClassA constructor is invoked, no arguments are passed to it. This is a standard practice in the prototype chain to ensure that the constructor has no parameters.
Blending Mode
This method mixes the object impersonation and prototype chain approach. Example:
Copy Code code as follows:
function ClassA (scolor) {
This.color=scolor;
}
Classa.prototype.saycolor=function () {
alert (This.color);
}
function ClassB (scolor,sname) {
Classa.call (This,scolor);
This.name=sname;
}
Classb.prototype=new ClassA ();
Classb.prototype.sayname=function () {
alert (this.name);
}
Call Example:
Copy Code code as follows:
var objb=new classb ("Red", "test");
Objb.saycolor ()//Output red
Objb.sayname ()//Output test
Author: artwl
