Review object-oriented JavaScript programming

zhaozj2021-02-08  360

It didn't think that the first time I wrote an article actually at the headline of the CBS, maybe the most important thing is from HAX's deep comment. I appreciate HAX's talents, so for his comments, it is full of all-in-law. As for some netizens who are not very satisfied with his comment style, this varies from person to person, I personally don't do too much comments.

Object-oriented

JavaScript

Program

- For the original "facing. . . "Supplement

Author: Blue Wings

Contact: liuruhong@263.net

Keywords: JavaScript OOP object-oriented JScript prototype Prototype

Summary:

In the original "object-oriented JavaScript program", the author puts forward the idea of ​​OOP through JavaScript (exactful JScript, which is the exact sense). Because of the limitations of the author's knowledge, there are some unconscious ideas, thank you Some netizens provide comments, combined with the actual work of this time, the author fixes some ideas in the original text.

Because of the limited reason, JavaScript mentioned below is only from Microsoft's JScript, as for some differences between NetScape, but only in the range known by the author. In the original text, the author puts forward the concept of object-oriented JavaScript, not hoping to sell Script skills, just think that in the development process, it will be used, so some relatively feasible recommendations are proposed from the perspective of individual.

Original text proposes various concepts, packages, inheritance, overloading, events, etc., because of personal understanding, there are many places in the original text, so this article is only some of the individuals of the original text.

JavaScript From OOP's perspective, it should not be a pure OOP language, more accurate, is an object-based scripting language, so the so-called concept of the original article mentioned is just from the perspective of the traditional OOP language. Described, and the so-called class implementation should be a prototype implementation because prototype is a most important manifestation throughout the implementation.

In theory, all Function is Object, so the creation of the class can be implemented completely, the original text uses Function just to better implement some functions, the following is achieved, packaged, inherited, overloaded, these five Concept is some specific elaboration.

1. Implement.

JavaScript Function is a class-class citizen (HAX primitive), so it is the best way to use the function, as for the following two code to implement this is based on the habit of personal programming, and some implementation of the deviation I will The following description will be described in detail below.

Code 1

Function myObject (sname) {

THIS.NAME = SNAME;

THIS.MESSAGEBOX = Function () {

Alert ("Name this.name);

}

This.changename = ChangeName;

Function ChangeName () {

THIS.NAME = "Change" this.Name;

}

}

Code 2

Function myObject (sname) {

THIS.NAME = SNAME;

}

MyObject.prototype.MessageBox = function () {

Alert ("Name this.name);

}

MyObject.Prototype.changeName = function () {this.name = "change" this.name;

}

The standard class implementation structure and prototype implementation method is not different. If you use the traditional class, such as (the language like C , SmallTalk), the first solution should be adopted, but I personally Words, I recommend using the second solution, after all, in the development process, such written methods and JavaScript write methods are relatively close, basically in the implementation of Function.

2. Encapsulate

Since the concept of the object is introduced, you must take into account the language of the package, C has the concept of Private, Protected, Public, in JavaScript, no corresponding protected concept, but in Private and Public can implicit implementation In addition, if a large number of private variables are needed, the implementation can be used to adopt a plan, and the following code is shown.

Function myObject (sname) {

VAR mvar = 1;

THIS.NAME = SNAME;

THIS.MESSAGEBOX = Function () {

Alert ("Name this.name);

MVAR = 2;

}

This.changename = ChangeName;

Function ChangeName () {

THIS.NAME = "Change" this.Name;

}

THIS.GETVAR = function () {

Return mvar;

}

}

MVAR is a private variable, name is a common variable, the function implemented within MyObject, and the Name can access anything in any implementation through this.name. For the processing of internal functions, ChangeName is not It can be accessed directly, but can be accessed through Object.ChangeName (), which has several netizens in HAX's comments. More detailed.

Simply, JavaScript provides private and public in objects, but does not provide explicit statements, and the functions and variables defined in class functions (let me call) are private variables, through this.methodname or this. VarName definitions are implemented by public purpipitals. It is also public.Prototype.name is also public, and private functions in class functions can access those private variables and functions, as for the way to implement as Object.Prototype.name whether the method can be accessed Private variable, I have not done, if anyone has done, trouble tell me.

The concept of Class is proposed in the VBS, and the following code can fully reflect the style of the package.

Class myclass

Private vloginid

Public username

Public property Get Loginid

Loginid = vloginid

End PropertyP

Public property Let Loginid (VVALUE)

Vloginid = VVALUE

End Property

END CLASS

There is no explicit so-called attribute concept in JavaScript, which is more clean, JavaScript.

There is no such concept, but it can be made using a similar design method similar to Java, such as get_propertyname, set_propertyname. I personally suggested that the function is implemented. If the parameters are tape, the set operation is indicated, if not the parameter, it can be considered a GET operation. Simply use the following code style. Object.prototype.username = function (vvalue) {

IF (vvalue) {

// Todo Get

}

Else {

Return Value;

}

}

The above mentioned is just the view of my personal implementation.

3. inherit

In the original text, the inheritance can be implemented by setting the prototype, which is achieved by subobject.prototype = new baseObject, as for the corresponding constructor, in the original text

THIS.BASE = PARENTCLASS;

THIS.BASE ();

This way is actually calling the constructor of the parent class to complete the prototype setting, and the object instantiated by SubObject can access all methods of the parent class. In the actual development process, I encountered the following problems. When I was implemented, I didn't have any difference between the programs one and programs, but the following code was a bit strange.

Function SON (SNAME) {

THIS.BASE = MyObject;

this.base (sname);

}

SON.PROTOTYPE.MESSAGEBOX = Function () {

//this.base.MessageBox ();

Alert ("Subclass Call");

}

SON.PROTOTYPE.HI = Function () {

Alert ("kk");

}

Var o = new Son ("Hello");

O.MessageBox ();

The final execution result is the method of myObject.MessageBox, SON.PROTOTYPE.MESSAGEBOX does not execute, unclear whether it is my code, there is a problem, inheritance, I found this.Method = functionName and Object. prototype.methodname implemented is not exactly the same, if anyone is more understanding in this respect, trouble tells me.

You can complete inheritance in the code that is just now, the method used here should be initialized, so Object.MessageBox, etc. Other functions are fully initialized, and if there is no SubObject.Prototype = baseObject, then BaseObject.prototype. Some methods for MethodName are not implemented.

4. Overload

In the original text, I mentioned to override the way using Object.Prototype.MethodName, but it retains a problem, just how to call the parent class, this.base = myObject, this.base () This only enables some methods of implementation of the constructor, that is, some methods or properties that the parent class itself definition is in its own body. It cannot be implemented by prototype Prototype, which is also used as Subobject.Prototype = New BaseObject. There are some problems mentioned above.

In JScript 5.5 or more, there is a Call function. Through this function we can completely invoke the parent class, just the supermon, as the Super Down, is like the Super Down. If the reader's client system is IE6 or WinMe, it is already jscript5.5 or more version. As for XP or 2003, I don't have to say more. The JScript engine version is relatively low. I suggest to download high versions. BaseObject

-------------------

Function baseObject () {

this.msg = NULL

}

BaseObject.Prototyp.Message (msg) {

THIS.MSG = MSG;

Alert (this.msg);

THIS.MSG = "Change" this.msg;

}

SubObject

Function SubObject () {

BaseObject.call (this);

}

SubObject.prototype = new baseobject;

SubObject.prototype.Message = Function (MSG) {

BaseObject.Prototype.Message.call (this, MSG);

Alert (this.msg);

}

Call code

VAR v = new subsipect ();

v.Message ("Hello");

For the parent class, Call (this, args) indicates the current instance call. In the SubObject, BaseObject.call (this) calls the parent class method, when the Message function is overloaded, in order to maintain the original Function, first call the parent class's Message method, and then write your own implementation code.

From the code, you can clearly see the method called using BaseObject.Prototype.MethodName.Call (this, args), because the Call function is used, so it is necessary to support support.

The above I discussed the implementation of JScript, as for other engines such as Netscape or Flash Script, I can return to the parent class by __proto__, so there is a simple amount, this._proto__ is equivalent to Java SUPER, you can call directly.

In the low version of the JScript engine, I don't know if I can achieve through instanceof or other functions, which also hopes that everyone will discuss.

5. event

Originally, in OOP programming, I should not discuss such problems, but in the actual application may need to use the form of similar events, so in the original text, it is basically a method similar to the virtual function in C , but is defined. It's just a method of using a normal variable.

If the class itself is binding to the DOM, you can use the FireEvent function for HTML to trigger some events, but these should have been discussed by DHTML.

JavaScript itself does not have a so-called object-oriented object oriented, the original and this paper is only for some logic in the actual development work, and it is indeed a lot of things that use OOP inside the browser, but for JScript Library Developers say that object-oriented is indeed a lot of benefits. The purpose of writing this article is also hoped to help the developers of JScript library, at least as a reference.

Because it is limited, some understandings may be biased above, and some people want someone to point out.

Reference: 1. Object-oriented JavaScript programming (liuruhong original)

Http://www.cbs.net/develop/read_article.asp?id=19401

2. Comment on "Object-Oriented JavaScript Programming" (HAX original)

http://www.cbs.net/develop/read_article.asp?id=19485

转载请注明原文地址:https://www.9cbs.com/read-319.html

New Post(0)