JavaScript object-oriented experience [summary]

Source: Internet
Author: User

The object-oriented design of JavaScript is a little far-fetched. After all, the JavaScript language itself is not highly rigorous. Before reading this article, I hope you can understand c ++, java, c #, and other advanced languages and have basic knowledge of object-oriented programming.
1. Class Definition:
Function ClassName (){
}
You can find that the class definition is the same as the function.
In fact, functions and classes can be distinguished only when they are used. For example, we use them on a page:
<Script language = "javascript">
Function (){
Alert ('hello ');
}

// A is used as A function
A ();

// A is used as A class, and an obj object is generated from Class.
Var obj = new ();
</Script>

2. Class Members:
Function ClassName (){
// Define public variables
This. property1 = 0;
// Define a public Method
This. method1 = function (){
// Determine whether this. a is assigned a value
If (this.! = Undefined)
Alert (this. );
}

// Definition form of another method
This. method3 = funcA;

// Define private members
Var pram1 = 1;
Var method2 = function (){
Alert ('');
}
}
// FuncA is the processing function of method method3.
Function funcA (){
Alert ('');
}
The above code will be explained to you:
All members starting with this are class members and all are public.
For example, property1 is a Class Attribute and method1 is a class method;
Class Members do not need to be defined using var, and private variables are not used with the this prefix.
For example, pram1 is a private variable and method2 is a private method;
The class attributes can not be defined in the class, but can still be called elsewhere;
For example, to output the attribute in method1, the attribute is not defined in the entire class. We can assign values to the attribute when creating an object.
Var obj = new ClassName ()
Obj. a = "hello javascript ";
Obj. method1 ();
Class methods can be defined through this. method = function () {}, such as the method1 method;
You can also use this. method = funcName to define a method for a function, such as method3;

3. class inheritance:
Function classA (){
This. property1 = 'hello ';
This. method1 = function (){
Alert (this. property1 );
}
}

Function classB (){
}
// Inherit classA
ClassB. prototype = new classA ();

// Add PI attributes to classB
ClassB. prototype. PI = 3.1415926;
// Add the showPI method to classB
ClassB. prototype. showPI = function (){
Alert (this. PI );
}
The prototype object is used to assign a class classA instance to the prototype object, so that classB inherits all the members of classA;
For example: classB. prototype = new classA ();
You can also use prototype to add new members to the class outside the class (this is a function not available in other advanced languages );
For example: classB. prototype. PI and classB. prototype. showPI

4. overload of class methods:
The overload of class methods is usually used in the class constructor. For example, there are two methods in the class with the same name but different parameters or different parameter types. JavaScript does not support class method overloading in form. We can use its arguments attribute to overload class methods:
Function classA (){
// Obtain the number of parameters
// Note that this. arguments. length is incorrect.
Var num = classA. arguments. length;

This. method1 = function (){
If (num = 0 ){
Alert (0 );
}
If (num = 1 ){
Alert (1 );
}
}
}
The arguments attribute of the class or function name returns an array containing all parameters;
For example, classA. arguments. length can be used to obtain the number of parameters. classA. arguments [0] can be used to obtain the value of the first parameter.
As needed, the same function or class has different functions by obtaining the number or value of parameters. For example:
Var obj = new classA ();
Obj. method1 (); // 0 is output
Var obj1 = new classA (5 );
Obj1.method1 (); // output 1

5. object definition:
// The object is an instance of a class and defines a class as an object template.
Function (){
This. a = 1;
This. B = 2;
This. add = function (){
Return this. a + this. B;
}
}
// Define an object
Var obj = new ();
// Assign values to attributes
Obj. a = 5;
Obj. B = 6;
// Call the Class Method
Var sum = obj. add ();

Another definition method:
Var obj = {
A: 1,
B: 2,
Add: function (){
Return this. a + this. B;
}
}

The object defined in this method also defines the structure of its class, suitable for the class that is only once used
When defining attributes and methods, you do not need to use the this keyword. ":" And then assign a value directly.
However, to use attributes in a method, you must use the this keyword.

This article is just my personal experience and understanding. It is estimated that I have written something different from some books. I believe that I can understand it quickly after reading it. This article only serves as a reference, and the specific project needs to be taken into account. All examples involved are self-debugged. If any errors occur, please correct them.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.