Research on implementing OOP in javascript prototype mode

Copy codeThe Code is as follows:

Copy codeThe Code is as follows:
Function ()
{
This. v1 = 10;
}
A. prototype. print = function ()
{
Alert (this. v1 );
}
Function B ()
{
}
B. prototype = new ();
New B (). print ();

The output of running this code is 10. It seems that Class B inherits the print method of Class A and produces the correct output. The actual execution process is in the object generated by Class B, the method print cannot be obtained directly, so we can find the corresponding method in its prototype attribute. The starting point of this solution is very good. If Class B exists, we call class B, otherwise, call the method of the same name in its prototype attribute (Class. However, sometimes we need subclass methods to call methods with the same name as the parent class. For example, if Class B is changed
Copy codeThe Code is as follows:
Function B ()
{
This. v2 = 15;
}
B. prototype = new ();
B. prototype. print = function ()
{
This. prototype. print. call (this );
Alert (this. v2 );
}
New B (). print ();

Among them, this. prototype. print is the print method corresponding to Class A, and the output is 10 and 15. It seems that the problem has been solved. Otherwise, we will inherit another layer.
Copy codeThe Code is as follows:
Function C ()
{
This. v3 = 20;
}
C. prototype = new B ();
C. prototype. print = function ()
{
This. prototype. print. call (this );
Alert (this. v3 );
}
New C (). print ();

The output we expect is 10, 15, 20 in sequence, but unfortunately, the Write result is that the system will be in an endless loop.
Because when executing this method,
Copy codeThe Code is as follows:
C. prototype. print = function ()
{
This. prototype. print. call (this );
Alert (this. v3 );
}

The following method will be called cyclically until the stack overflows.
Copy codeThe Code is as follows:
B. prototype. print = function ()
{
This. prototype. print. call (this );
Alert (this. v2 );
}

The correct statement should be changed
Copy codeThe Code is as follows:
B. prototype. print = function ()
{
A. prototype. print. call (this );
Alert (this. v3 );
}
C. prototype. print = function ()
{
B. prototype. print. call (this );
Alert (this. v3 );
}

However, when the inheritance relationship changes, you need to modify a considerable number of references to the parent class. This is not the best method. In actual application, you can use _ super to replace the parent class name, And _ this to replace your own name, and then replace them with [super] in a standard way. prototype or [this]. prototype to call the specified method without ambiguity. This is the real solution of javascript OOP. The related code is as follows:
Copy codeThe Code is as follows:
/*
When using the OOP inheritance system, first define the class, and finally execute the extendsOf initialization class. Use _ super to reference the parent class. For example, use _ this to reference its own method,
For example:
Function Extend2 ()
{
_ Super ();
}
Extend2.prototype. setValue = function (value)
{
_ Super. setValue (value );
Alert ("Extend2:" + value );
}
Extend2.extendsOf (Extend1 );

The root of the class inheritance tree is Object. Note: All member functions that use escape must be defined before the extendsOf method is called.
You can set an automatic initialization code for an object, starting with an underscore (_). The name is the same as the object name, as shown in figure
Object. _ Object = function (){...}
If the initialization code of the object does not exist, the initialization code of the parent object will be automatically searched until all the searches are complete.
Copy codeThe Code is as follows:
Function. FRBlock =/* ("([^" ^ \] | \ ") *" | '([^' ^ \] | \\') * '| \/([^ \/^ \] | \\.) *\/)*/;
Function. FRSpace =/\ s +/g;
Function. FRSign = /? (^ |; | :|<|| \? |, | \. | \/| \ {| \} | \ [| \] | \-| \ + | \ = | \ (| \) | \ * | \ ^ | \ % | \ | )? /G;
Function. FRRefer =/_ (super | this) (\. [^ (] + )? \ ([^ \)] *) \)/;
Function. prototype. FCompile = function (name)
{
// Check whether the constructor is a class or a class attribute. If the name parameter is null, the constructor is used.
If (name)
{
// The class property is not a function implementation. The class is directly assigned to the subclass and exits.
If (typeof this. prototype [name]! = "Function ")
{
Window [this. FClassName]. prototype [name] = this. prototype [name];
Return;
}
Var s = this. prototype [name]. toString ();
}
Else
{
Var s = this. toString ();
}
Var B = "";
Var r;
// Filter blank characters
While (r = Function.FRBlock.exe c (s ))
{
S = RegExp. rightContext;
B + = RegExp. leftContext. replace (Function. FRSpace, ""). replace (Function. FRSign, "$1") + r [1];
}
B + = s. replace (Function. FRSpace, ""). replace (Function. FRSign, "$1 ");
Var I = B. indexOf ("(");
Var j = B. indexOf (")", I );
If (! Name)
{
This. FClassName = B. substring (9, I );
}
Var cn = this. FClassName;
Var arg = B. substring (I + 1, j );
S = B. substring (j + 2, B. length-1 );
B = "";
// Escape the call and replace _ super, _ this with the specified method.
For (var n = 0; r = Function.FRRefer.exe c (s); n ++)
{
If (r [2])
{
If (! Name &&! N)
{
B = this. FSuperClass. FClassName + ". apply (this, arguments );";
}
R [2] = ". prototype" + r [2];
}
Else if (r [1] = "this ")
{
// JS functions do not distinguish between parameters. constructors cannot call themselves recursively.
Throw "Constructor call mustn't be \" _ this (); \ "in a constructor ";
}
Else if (name | RegExp. leftContext)
{
Throw "Constructor call must be the first statement in a constructor ";
}
Else
{
R [2] = "";
}
S = RegExp. rightContext;
B + = RegExp. leftContext + (r [1] = "this "? Cn: this. FSuperClass. FClassName) + r [2] + (r [3]? ". Call (this," + r [3] + ")": ". apply (this, arguments )");
}
If (n)
{
B + = s;
}
Else if (name)
{
// No call for _ this, _ super, no compilation required
Window [cn]. prototype [name] = this. prototype [name];
Return;
}
Else
{
// Automatically added when the parent class constructor is not called
B = this. FSuperClass. FClassName + ". apply (this, arguments);" + s;
}
// Assign values to the compilation result
If (name)
{
Eval (cn + ". prototype." + name + "= function (" + arg + ") {" + B + "}");
}
Else
{
Eval (cn + "= function (" + arg + ") {" + B + "; if (this. constructor = "+ cn +") "+ cn + ". _ "+ cn + ". apply (this, arguments );}");
Window [cn]. FClassName = cn;
}
}
Function. prototype. extendsOf = function (superClass)
{
This. FSuperClass = superClass;
// Compile all functions of the class
This. FCompile ();
For (var name in this. prototype)
{
This. FCompile (name );
}
Var clazz = window [this. FClassName];
Clazz. FSuperClass = superClass;
// Copy the functions and attributes that are not implemented by the subclass in the parent class.
Var prototype = clazz. prototype;
For (var name in superClass. prototype)
{
If (! Prototype [name])
{
Prototype [name] = superClass. prototype [name];
}
}
// Copy the initialization method in the format of Object. _ Object
For (var c = this; c = c. FSuperClass)
{
If (c ["_" + c. FClassName])
{
Clazz ["_" + clazz. FClassName] = c ["_" + c. FClassName];
Return;
}
}
}
/*
Built-in Object classes provide support for OOP
*/
Object. FClassName = "Object ";
Object. _ Object = Function. Instance;
Object. prototype. instanceOf = function (clazz)
{
For (var c = this. constructor; c = c. FSuperClass)
{
If (c = clazz)
{
Return true;
}
}
Return false;
}